/* ============================================================
   PARIJUSTE — HOME V5
   ============================================================ */

.pj-home-v5{
  --pj5-ink:#111b22;
  --pj5-text:#35413d;
  --pj5-muted:#6d7974;
  --pj5-soft:#f4f7f5;
  --pj5-bg:#f8faf9;
  --pj5-white:#ffffff;
  --pj5-border:#e2e8e5;
  --pj5-green:#12a66a;
  --pj5-green-dark:#0d8d59;
  --pj5-green-soft:#eaf7f0;
  --pj5-blue:#4c9fbd;

  margin:0;
  background:var(--pj5-bg);
  color:var(--pj5-ink);
  font-family:Inter,Arial,Helvetica,sans-serif;
}

.pj-home-v5 main{
  overflow:hidden;
}

.pj5-shell{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
}


/* NAVBAR FINISH */

.pj-home-v5 .pj5-nav{
  border-top:0;
  border-bottom:1px solid #e6ebe8;
  box-shadow:none;
}

.pj-home-v5 .pj5-nav__inner{
  height:68px;
  grid-template-columns:auto auto 1fr;
  gap:42px;
}

.pj-home-v5 .pj5-nav__links{
  justify-content:flex-start;
  gap:29px;
}

.pj-home-v5 .pj5-nav__links a{
  font-size:14px;
  font-weight:600;
  color:#59645f !important;
}

.pj-home-v5 .pj5-nav__actions{
  justify-self:end;
}

.pj-home-v5 .pj5-nav__login{
  font-size:14px;
}

.pj-home-v5 .pj5-nav__cta{
  min-height:42px;
  padding:0 18px;
  border-color:var(--pj5-green);
  background:var(--pj5-green);
  font-size:13px;
  font-weight:750;
}

.pj-home-v5 .pj5-nav__cta:hover{
  background:var(--pj5-green-dark);
}


/* HERO */

.pj5-hero{
  position:relative;
  padding:66px 0 70px;
  background:
    radial-gradient(
      circle at 82% 18%,
      rgba(18,166,106,.065),
      transparent 25rem
    ),
    var(--pj5-bg);
}

.pj5-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(500px,1.08fr);
  gap:72px;
  align-items:center;
}

.pj5-hero__copy{
  max-width:555px;
}

.pj5-hero__eyebrow{
  display:flex;
  align-items:center;
  gap:11px;
  margin-bottom:19px;

  color:var(--pj5-green-dark);
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
}

.pj5-hero__eyebrow > span{
  width:25px;
  height:2px;
  background:var(--pj5-green);
}

.pj5-hero h1{
  margin:0;
  color:var(--pj5-ink);
  font-family:Inter,Arial,Helvetica,sans-serif;
  font-size:clamp(46px,3.55vw,54px);
  font-weight:820;
  line-height:1.04;
  letter-spacing:-.052em;
}

.pj5-hero h1 > span{
  display:block;
  margin-top:4px;
  color:#47544f;
}

.pj5-hero__lead{
  max-width:525px;
  margin:24px 0 0;

  color:#5f6c67;
  font-size:17px;
  line-height:1.68;
}

.pj5-hero__actions{
  display:flex;
  align-items:center;
  gap:24px;
  margin-top:29px;
}

.pj5-hero__primary{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;

  padding:0 21px;

  border:1px solid var(--pj5-green);
  border-radius:9px;
  background:var(--pj5-green);

  color:#fff !important;
  font-size:14px;
  font-weight:750;
  text-decoration:none !important;

  box-shadow:0 8px 22px rgba(18,166,106,.14);
}

.pj5-hero__primary:hover{
  background:var(--pj5-green-dark);
}

.pj5-hero__primary span{
  font-size:17px;
}

.pj5-hero__secondary{
  color:#46534e !important;
  font-size:14px;
  font-weight:650;
  text-decoration:none !important;
}

.pj5-hero__secondary:hover{
  color:var(--pj5-green-dark) !important;
}

.pj5-hero__offer{
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:14px;

  color:#78847f;
  font-size:12px;
}

.pj5-hero__offer strong{
  color:#4a5752;
  font-weight:750;
}

.pj5-hero__offer > span{
  width:3px;
  height:3px;
  border-radius:50%;
  background:#a7b0ac;
}

/* PRODUCT PREVIEW */

.pj5-demo{
  overflow:hidden;
  border:1px solid #dce4e0;
  border-radius:16px;
  background:#fff;
  box-shadow:
    0 22px 55px rgba(23,43,35,.08),
    0 3px 10px rgba(23,43,35,.035);
}

.pj5-demo__top{
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 20px;
  border-bottom:1px solid #edf1ef;
}

.pj5-demo__top > div{
  display:flex;
  align-items:center;
  gap:9px;

  color:#4c5954;
  font-size:12px;
  font-weight:700;
}

.pj5-demo__pulse{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--pj5-green);
}

.pj5-demo__top small{
  padding:5px 8px;
  border:1px solid #e5ebe8;
  border-radius:999px;

  color:#82908a;
  font-size:9px;
  font-weight:800;
  letter-spacing:.09em;
}

.pj5-demo__match{
  display:grid;
  grid-template-columns:1fr auto;
  gap:24px;
  align-items:end;

  padding:18px 20px;
  border-bottom:1px solid #edf1ef;
}

.pj5-demo__match > div{
  display:grid;
  gap:5px;
}

.pj5-demo__match small,
.pj5-demo__selection small{
  color:#8a9691;
  font-size:10px;
  font-weight:750;
  letter-spacing:.08em;
}

.pj5-demo__match strong{
  color:var(--pj5-ink);
  font-size:17px;
  font-weight:750;
}

.pj5-demo__selection{
  text-align:right;
}

.pj5-demo__selection strong{
  color:#4d5a55;
  font-size:13px;
}

.pj5-demo__odds{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  padding:14px 20px 0;
}

.pj5-demo__odd{
  min-height:60px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;

  padding:0 15px;

  border:1px solid #e5ebe8;
  border-radius:10px;
  background:#fbfcfb;
}

.pj5-demo__odd span{
  color:#6c7974;
  font-size:11px;
  font-weight:750;
}

.pj5-demo__odd strong{
  color:var(--pj5-ink);
  font-size:19px;
  font-weight:800;
}

.pj5-demo__odd > div{
  display:flex;
  align-items:baseline;
  gap:8px;
}

.pj5-demo__odd del{
  color:#a1aba7;
  font-size:12px;
}

.pj5-demo__movement{
  padding:18px 20px 12px;
}

.pj5-demo__movement-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
}

.pj5-demo__movement-head > div{
  display:grid;
  gap:4px;
}

.pj5-demo__movement-head small{
  color:#89958f;
  font-size:10px;
  font-weight:750;
  letter-spacing:.08em;
}

.pj5-demo__movement-head strong{
  color:#34413c;
  font-size:13px;
}

.pj5-demo__movement-head > span{
  padding:5px 8px;
  border-radius:6px;
  background:var(--pj5-green-soft);
  color:var(--pj5-green-dark);
  font-size:11px;
  font-weight:800;
}

.pj5-demo__chart{
  width:100%;
  height:94px;
  display:block;
  margin-top:8px;
}

.pj5-demo__grid{
  fill:none;
  stroke:#edf1ef;
  stroke-width:1;
}

.pj5-demo__line-a{
  fill:none;
  stroke:var(--pj5-blue);
  stroke-width:2;
}

.pj5-demo__line-b{
  fill:none;
  stroke:var(--pj5-green);
  stroke-width:2.5;
}

.pj5-demo__point{
  fill:var(--pj5-green);
}

.pj5-demo__signal{
  display:grid;
  grid-template-columns:125px 1fr;
  gap:20px;

  margin:0 20px;
  padding:16px 0 18px;

  border-top:1px solid #e8eeeb;
}

.pj5-demo__score{
  display:grid;
  gap:6px;
  align-content:start;
}

.pj5-demo__score small,
.pj5-demo__result > span{
  color:#89958f;
  font-size:9px;
  font-weight:800;
  letter-spacing:.08em;
}

.pj5-demo__score > div{
  display:flex;
  align-items:baseline;
}

.pj5-demo__score strong{
  color:var(--pj5-ink);
  font-size:34px;
  line-height:1;
  letter-spacing:-.05em;
}

.pj5-demo__score span{
  margin-left:3px;
  color:#8a9691;
  font-size:11px;
}

.pj5-demo__result{
  display:grid;
  gap:4px;
  padding-left:20px;
  border-left:1px solid #e5ebe8;
}

.pj5-demo__result strong{
  color:#25724f;
  font-size:13px;
}

.pj5-demo__result p{
  max-width:330px;
  margin:0;

  color:#77837e;
  font-size:11px;
  line-height:1.5;
}

/* NEXT SECTION */

.pj5-how{
  padding:58px 0 72px;
  border-top:1px solid #e7ece9;
  background:#fff;
}

.pj5-how span{
  color:var(--pj5-green-dark);
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
}

.pj5-how h2{
  max-width:680px;
  margin:13px 0 0;

  color:var(--pj5-ink);
  font-size:34px;
  font-weight:780;
  line-height:1.12;
  letter-spacing:-.04em;
}


/* RESPONSIVE */

@media(max-width:1050px){
  .pj5-hero__grid{
    grid-template-columns:1fr;
    gap:45px;
  }

  .pj5-hero__copy{
    max-width:680px;
  }

  .pj5-demo{
    max-width:720px;
  }
}

@media(max-width:820px){
  .pj5-shell{
    width:calc(100% - 30px);
  }

  .pj-home-v5 .pj5-nav__inner{
    width:calc(100% - 30px);
    height:64px;
    grid-template-columns:auto 1fr auto;
  }

  .pj5-hero{
    padding:48px 0 55px;
  }

  .pj5-hero h1{
    font-size:clamp(40px,11vw,50px);
  }
}

@media(max-width:620px){
  .pj5-hero__actions{
    align-items:flex-start;
    flex-direction:column;
    gap:16px;
  }

  .pj5-demo__match,
  .pj5-demo__signal{
    grid-template-columns:1fr;
  }

  .pj5-demo__selection{
    text-align:left;
  }

  .pj5-demo__odds{
    grid-template-columns:1fr;
  }

  .pj5-demo__result{
    padding:15px 0 0;
    border-left:0;
    border-top:1px solid #e5ebe8;
  }
}

/* Navbar — authenticated logout */

.pj5-nav__logout{
  color:#68736e !important;
  font-size:13px;
  font-weight:600;
  text-decoration:none !important;
  transition:color .15s ease;
}

.pj5-nav__logout:hover{
  color:#111b22 !important;
}

/* ============================================================
   V5 — COLOR DEPTH
   ============================================================ */

.pj-home-v5{
  --pj5-bg:#f0f4f1;
}

.pj5-hero{
  background:
    radial-gradient(
      circle at 82% 28%,
      rgba(18,166,106,.13),
      transparent 24rem
    ),
    linear-gradient(
      110deg,
      #f3f6f4 0%,
      #eef4f0 58%,
      #edf5f1 100%
    );
}

.pj5-hero h1 > span{
  color:#293630;
}

.pj5-demo{
  border-color:#d5dfda;
  box-shadow:
    0 26px 60px rgba(23,43,35,.12),
    0 4px 14px rgba(23,43,35,.05);
}

.pj5-how{
  background:#ffffff;
  border-top-color:#dfe7e3;
}

/* ============================================================
   PARIJUSTE — HERO V5.1
   ============================================================ */

.pj51-hero{
  position:relative;
  overflow:hidden;
  padding:58px 0 62px;
  background:
    radial-gradient(
      circle at 82% 28%,
      rgba(18,166,106,.13),
      transparent 25rem
    ),
    linear-gradient(
      112deg,
      #f4f6f3 0%,
      #eef3ef 58%,
      #e9f2ed 100%
    );
  border-bottom:1px solid #dde5e1;
}

.pj51-hero::after{
  content:"";
  position:absolute;
  z-index:0;
  right:-80px;
  top:80px;
  width:520px;
  height:260px;
  opacity:.24;
  pointer-events:none;
  background:
    linear-gradient(
      145deg,
      transparent 49.5%,
      rgba(18,166,106,.16) 50%,
      transparent 50.5%
    );
}

.pj51-hero .pj5-shell{
  position:relative;
  z-index:1;
}

.pj51-grid{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(520px,1.08fr);
  align-items:center;
  gap:76px;
}

.pj51-copy{
  max-width:555px;
}

.pj51-eyebrow{
  display:flex;
  align-items:center;
  gap:11px;
  margin-bottom:18px;
  color:#0b8f5a;
  font-size:11px;
  font-weight:800;
  letter-spacing:.13em;
}

.pj51-eyebrow > span{
  width:25px;
  height:2px;
  background:#12a66a;
}

.pj51-copy h1{
  margin:0;
  color:#111b22;
  font-family:Inter,Arial,Helvetica,sans-serif;
  font-size:clamp(45px,3.45vw,54px);
  font-weight:830;
  line-height:1.035;
  letter-spacing:-.052em;
}

.pj51-copy h1 > span{
  display:block;
  margin-top:4px;
  color:#293730;
}

.pj51-lead{
  max-width:535px;
  margin:23px 0 0;
  color:#5e6b66;
  font-size:17px;
  line-height:1.65;
}

.pj51-actions{
  display:flex;
  align-items:center;
  gap:24px;
  margin-top:28px;
}

.pj51-primary{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:27px;
  padding:0 21px;
  border:1px solid #12a66a;
  border-radius:9px;
  background:#12a66a;
  box-shadow:0 9px 24px rgba(18,166,106,.16);
  color:#fff !important;
  font-size:14px;
  font-weight:750;
  text-decoration:none !important;
}

.pj51-primary:hover{
  background:#0d8d59;
  border-color:#0d8d59;
}

.pj51-primary span{
  font-size:17px;
}

.pj51-secondary{
  color:#46534e !important;
  font-size:14px;
  font-weight:650;
  text-decoration:none !important;
}

.pj51-secondary:hover{
  color:#0d8d59 !important;
}

.pj51-offer{
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:14px;
  color:#77837e;
  font-size:12px;
}

.pj51-offer strong{
  color:#43504b;
  font-weight:750;
}

.pj51-offer > span{
  width:3px;
  height:3px;
  border-radius:50%;
  background:#a4aea9;
}

/* V5.1 — ODDS STORY */

.pj51-story{
  overflow:hidden;
  border:1px solid #d5dfda;
  border-radius:18px;
  background:#fff;
  box-shadow:
    0 26px 65px rgba(27,52,41,.12),
    0 5px 16px rgba(27,52,41,.05);
}

.pj51-story__top{
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:0 21px;
  border-bottom:1px solid #e9eeeb;
}

.pj51-story__top > div{
  display:flex;
  align-items:center;
  gap:9px;
  color:#6c7873;
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
}

.pj51-live{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#12a66a;
  box-shadow:0 0 0 4px rgba(18,166,106,.09);
}

.pj51-story__top > span{
  padding:5px 9px;
  border:1px solid #e2e8e5;
  border-radius:999px;
  color:#7b8782;
  font-size:10px;
  font-weight:750;
}

.pj51-match{
  display:grid;
  gap:5px;
  padding:18px 21px 15px;
}

.pj51-match small{
  color:#8b9691;
  font-size:10px;
  font-weight:750;
  letter-spacing:.08em;
}

.pj51-match strong{
  color:#111b22;
  font-size:19px;
  font-weight:780;
  letter-spacing:-.02em;
}

.pj51-evolution{
  display:grid;
  grid-template-columns:105px 1fr 105px;
  align-items:center;
  gap:18px;
  margin:0 21px;
  padding:20px 0 22px;
  border-top:1px solid #edf1ef;
}

.pj51-price{
  display:grid;
  gap:2px;
}

.pj51-price small{
  color:#84908b;
  font-size:11px;
  font-weight:650;
}

.pj51-price strong{
  color:#34413c;
  font-size:30px;
  font-weight:820;
  line-height:1.05;
  letter-spacing:-.05em;
}

.pj51-price > span{
  color:#8a9691;
  font-size:9px;
  font-weight:750;
  letter-spacing:.07em;
}

.pj51-price--now{
  text-align:right;
}

.pj51-price--now strong{
  color:#0c965e;
}

.pj51-journey{
  display:grid;
  gap:8px;
  justify-items:center;
}

.pj51-journey__line{
  position:relative;
  width:100%;
  height:22px;
}

.pj51-journey__line::before{
  content:"";
  position:absolute;
  left:0;
  right:9px;
  top:10px;
  height:2px;
  background:linear-gradient(90deg,#a8b7b0,#12a66a);
}

.pj51-journey__line::after{
  content:"";
  position:absolute;
  right:0;
  top:5px;
  width:0;
  height:0;
  border-top:6px solid transparent;
  border-bottom:6px solid transparent;
  border-left:9px solid #12a66a;
}

.pj51-journey__line > span{
  position:absolute;
  left:0;
  top:6px;
  width:10px;
  height:10px;
  border:2px solid #8da099;
  border-radius:50%;
  background:#fff;
}

.pj51-journey__line > i{
  position:absolute;
  right:8px;
  top:6px;
  width:10px;
  height:10px;
  border:2px solid #12a66a;
  border-radius:50%;
  background:#fff;
}

.pj51-journey > strong{
  padding:4px 8px;
  border-radius:999px;
  background:#e8f6ef;
  color:#0c8e59;
  font-size:11px;
  font-weight:800;
}

.pj51-insight{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:14px;
  margin:0 21px;
  padding:17px 18px;
  border:1px solid #cfe8db;
  border-radius:11px;
  background:#edf8f2;
}

.pj51-insight__icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:#12a66a;
  color:#fff;
  font-size:22px;
  font-weight:750;
}

.pj51-insight > div{
  display:grid;
  gap:3px;
}

.pj51-insight small{
  color:#57816e;
  font-size:9px;
  font-weight:800;
  letter-spacing:.09em;
}

.pj51-insight strong{
  color:#176844;
  font-size:14px;
  font-weight:780;
}

.pj51-insight p{
  margin:0;
  color:#63766d;
  font-size:12px;
}

.pj51-market{
  min-height:50px;
  display:flex;
  align-items:center;
  gap:23px;
  margin-top:17px;
  padding:0 21px;
  border-top:1px solid #e9eeeb;
  color:#77837e;
  font-size:11px;
  font-weight:650;
}

.pj51-market strong{
  margin-left:4px;
  color:#26342e;
  font-size:13px;
}

.pj51-market__status{
  margin-left:auto;
  color:#0d8d59;
  font-weight:750;
}

/* V5.1 — RESPONSIVE */

@media(max-width:1050px){
  .pj51-grid{
    grid-template-columns:1fr;
    gap:42px;
  }

  .pj51-copy{
    max-width:680px;
  }

  .pj51-story{
    max-width:720px;
  }
}

@media(max-width:700px){
  .pj51-hero{
    padding:44px 0 50px;
  }

  .pj51-copy h1{
    font-size:clamp(39px,11vw,49px);
  }

  .pj51-actions{
    align-items:flex-start;
    flex-direction:column;
    gap:16px;
  }

  .pj51-evolution{
    grid-template-columns:80px 1fr 80px;
    gap:10px;
  }

  .pj51-price strong{
    font-size:25px;
  }

  .pj51-market{
    flex-wrap:wrap;
    padding-top:12px;
    padding-bottom:12px;
  }

  .pj51-market__status{
    margin-left:0;
  }
}

/* ============================================================
   PARIJUSTE — MARKET THEME
   Même univers visuel que l'application
   ============================================================ */

body.pj-home-v5{
  background:
    radial-gradient(
      circle at 12% 0%,
      rgba(48,202,126,.11),
      transparent 34%
    ),
    radial-gradient(
      circle at 88% 8%,
      rgba(104,199,255,.07),
      transparent 28%
    ),
    linear-gradient(
      180deg,
      #0f1612 0%,
      #0a0f0d 100%
    ) !important;

  color:#f4efe5;
}


/* ---------- NAVBAR ---------- */

.pj-home-v5 .pj5-nav{
  background:rgba(10,15,13,.88) !important;
  border-bottom:1px solid rgba(244,239,229,.12) !important;
  box-shadow:0 12px 40px rgba(0,0,0,.16);
  backdrop-filter:blur(18px);
}

.pj-home-v5 .pj5-brand__name{
  background:linear-gradient(
    100deg,
    #f4faf7 0%,
    #f4faf7 48%,
    #62eaa5 72%,
    #30ca7e 100%
  );
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.pj-home-v5 .pj5-logo-p{
  fill:#f4faf7;
}

.pj-home-v5 .pj5-nav__links a,
.pj-home-v5 .pj5-nav__login,
.pj-home-v5 .pj5-nav__logout{
  color:#8fa59b !important;
}

.pj-home-v5 .pj5-nav__links a:hover,
.pj-home-v5 .pj5-nav__login:hover,
.pj-home-v5 .pj5-nav__logout:hover{
  color:#f4faf7 !important;
}

.pj-home-v5 .pj5-nav__cta{
  background:#42e89d;
  border-color:#42e89d;
  color:#07110d !important;
}


/* ---------- HERO ---------- */

.pj51-hero{
  background:
    radial-gradient(
      circle at 76% 20%,
      rgba(66,232,157,.10),
      transparent 30rem
    ),
    radial-gradient(
      circle at 10% 15%,
      rgba(48,202,126,.08),
      transparent 25rem
    ),
    linear-gradient(
      180deg,
      #0f1612 0%,
      #0a0f0d 100%
    ) !important;

  border-bottom:1px solid rgba(244,239,229,.10) !important;
}

.pj51-hero::after{
  opacity:.18;
}

.pj51-copy h1{
  color:#f4faf7;
}

.pj51-copy h1 > span{
  color:#d8e5de;
}

.pj51-lead{
  color:#8fa59b;
}

.pj51-primary{
  background:#42e89d;
  border-color:#42e89d;
  color:#07110d !important;
  box-shadow:0 12px 32px rgba(66,232,157,.16);
}

.pj51-primary:hover{
  background:#62eaa5;
  border-color:#62eaa5;
}

.pj51-secondary{
  color:#a9bbb2 !important;
}

.pj51-secondary:hover{
  color:#62eaa5 !important;
}

.pj51-offer{
  color:#6f867c;
}

.pj51-offer strong{
  color:#b8cbc1;
}

.pj51-offer > span{
  background:#52675d;
}


/* ---------- CARTE EXEMPLE ---------- */

.pj51-story{
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.035),
      transparent 52%
    ),
    rgba(5,29,21,.82) !important;

  border:1px solid rgba(255,255,255,.075) !important;

  box-shadow:
    0 30px 80px rgba(0,0,0,.28),
    0 5px 18px rgba(0,0,0,.18);
}

.pj51-story__top{
  border-bottom-color:rgba(244,239,229,.09);
}

.pj51-story__top > div{
  color:#8fa59b;
}

.pj51-story__top > span{
  border-color:rgba(244,239,229,.12);
  color:#8fa59b;
}

.pj51-live{
  background:#62eaa5;
  box-shadow:0 0 0 4px rgba(98,234,165,.10);
}

.pj51-match small{
  color:#6f867c;
}

.pj51-match strong{
  color:#f4faf7;
}

.pj51-evolution{
  border-top-color:rgba(244,239,229,.09);
}

.pj51-price small,
.pj51-price > span{
  color:#6f867c;
}

.pj51-price strong{
  color:#dce9e2;
}

.pj51-price--now strong{
  color:#62eaa5;
}

.pj51-journey__line::before{
  background:linear-gradient(
    90deg,
    #52675d,
    #62eaa5
  );
}

.pj51-journey__line::after{
  border-left-color:#62eaa5;
}

.pj51-journey__line > span{
  border-color:#6f867c;
  background:#092017;
}

.pj51-journey__line > i{
  border-color:#62eaa5;
  background:#092017;
}

.pj51-journey > strong{
  background:rgba(98,234,165,.10);
  color:#62eaa5;
}


/* ---------- MESSAGE ---------- */

.pj51-insight{
  background:rgba(98,234,165,.08);
  border-color:rgba(98,234,165,.24);
}

.pj51-insight__icon{
  background:#42e89d;
  color:#07110d;
}

.pj51-insight small{
  color:#62eaa5;
}

.pj51-insight strong{
  color:#dff7e9;
}

.pj51-insight p{
  color:#8fa59b;
}


/* ---------- BOOKMAKERS ---------- */

.pj51-market{
  border-top-color:rgba(244,239,229,.09);
  color:#6f867c;
}

.pj51-market strong{
  color:#dce9e2;
}

.pj51-market__status{
  color:#62eaa5;
}


/* ---------- SECTION SUIVANTE ---------- */

.pj5-how{
  background:#0a0f0d !important;
  border-top-color:rgba(244,239,229,.10) !important;
}

.pj5-how h2{
  color:#f4faf7;
}

.pj5-how p{
  color:#8fa59b;
}

/* ============================================================
   PARIJUSTE — MARKET THEME / LIGHTER BACKGROUND
   ============================================================ */

body.pj-home-v5{
  background:
    radial-gradient(
      circle at 12% 0%,
      rgba(48,202,126,.15),
      transparent 36%
    ),
    radial-gradient(
      circle at 88% 8%,
      rgba(104,199,255,.07),
      transparent 30%
    ),
    linear-gradient(
      180deg,
      #294236 0%,
      #20362b 100%
    ) !important;
}

.pj51-hero{
  background:
    radial-gradient(
      circle at 76% 20%,
      rgba(66,232,157,.13),
      transparent 30rem
    ),
    radial-gradient(
      circle at 10% 15%,
      rgba(48,202,126,.11),
      transparent 25rem
    ),
    linear-gradient(
      180deg,
      #294236 0%,
      #20362b 100%
    ) !important;
}

.pj5-how{
  background:#20362b !important;
}

/* ============================================================
   PARIJUSTE — HERO DECISION CARD / OÙ + QUAND
   ============================================================ */

.pj51-decision{
  padding-bottom:0;
}

.pj51-decision .pj51-match{
  padding-bottom:20px;
}


/* ---------- BLOCS OÙ / QUAND ---------- */

.pj51-answer{
  margin:0 22px 14px;
  padding:18px;
  border:1px solid rgba(244,239,229,.10);
  border-radius:15px;
  background:rgba(255,255,255,.025);
}

.pj51-answer--when{
  margin-bottom:22px;
}

.pj51-answer__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}

.pj51-answer__head > span{
  color:#62eaa5;
  font-size:15px;
  font-weight:900;
  letter-spacing:.08em;
}

.pj51-answer__head > small{
  color:#6f867c;
  font-size:11px;
  font-weight:700;
}


/* ---------- BOOKMAKERS ---------- */

.pj51-book-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:43px;
  padding:0 13px;
  margin-top:7px;
  border:1px solid rgba(244,239,229,.075);
  border-radius:11px;
  background:rgba(255,255,255,.025);
}

.pj51-book-row > span{
  color:#9aada3;
  font-size:13px;
  font-weight:750;
}

.pj51-book-row > strong{
  color:#dce9e2;
  font-size:18px;
  font-weight:900;
  letter-spacing:-.02em;
}

.pj51-book-row--best{
  border-color:rgba(98,234,165,.28);
  background:rgba(98,234,165,.075);
}

.pj51-book-row--best > span{
  color:#dff7e9;
}

.pj51-book-row--best > strong{
  color:#62eaa5;
}


/* ---------- VERDICT ---------- */

.pj51-verdict{
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:12px;
  padding:10px 12px;
  border-radius:10px;
  background:rgba(98,234,165,.07);
}

.pj51-verdict > span{
  display:grid;
  flex:0 0 auto;
  width:22px;
  height:22px;
  place-items:center;
  border-radius:50%;
  background:#42e89d;
  color:#07110d;
  font-size:12px;
  font-weight:950;
}

.pj51-verdict p{
  margin:0;
  color:#9aada3;
  font-size:12px;
  line-height:1.45;
}

.pj51-verdict p strong{
  color:#dff7e9;
  font-weight:850;
}


/* ---------- TIMING ---------- */

.pj51-timing{
  display:grid;
  grid-template-columns:1fr 38px 1fr;
  align-items:center;
  gap:12px;
}

.pj51-timing > div{
  display:grid;
  gap:5px;
  min-height:66px;
  align-content:center;
  padding:10px 13px;
  border:1px solid rgba(244,239,229,.075);
  border-radius:11px;
  background:rgba(255,255,255,.025);
}

.pj51-timing small{
  color:#6f867c;
  font-size:9px;
  font-weight:850;
  letter-spacing:.08em;
}

.pj51-timing strong{
  color:#dce9e2;
  font-size:17px;
  font-weight:900;
}

.pj51-timing > div:last-child strong{
  color:#62eaa5;
}

.pj51-timing__arrow{
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  border:1px solid rgba(98,234,165,.25);
  border-radius:50%;
  background:rgba(98,234,165,.08);
  color:#62eaa5;
  font-size:18px;
  font-weight:900;
}

.pj51-verdict--watch{
  background:transparent;
  border:1px solid rgba(98,234,165,.14);
}

.pj51-verdict--watch > span{
  background:rgba(98,234,165,.12);
  color:#62eaa5;
}


/* ---------- MOBILE ---------- */

@media(max-width:700px){

  .pj51-answer{
    margin-left:14px;
    margin-right:14px;
    padding:15px;
  }

  .pj51-answer__head{
    align-items:flex-start;
    flex-direction:column;
    gap:3px;
  }

  .pj51-timing{
    grid-template-columns:1fr 30px 1fr;
    gap:7px;
  }

  .pj51-timing__arrow{
    width:28px;
    height:28px;
    font-size:15px;
  }
}

/* ============================================================
   PARIJUSTE — HERO TYPOGRAPHY V2
   ============================================================ */

.pj51-copy h1{
  max-width:620px;
  margin:0;
  color:#62eaa5;
  font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size:clamp(38px,3vw,46px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.035em;
}

.pj51-copy h1 > span{
  display:block;
  margin-top:8px;
  color:#f4efe5;
  font-weight:700;
}

.pj51-lead{
  max-width:570px;
  margin-top:22px;
  color:#a9bbb2;
  font-size:16px;
  line-height:1.65;
}

@media(max-width:700px){
  .pj51-copy h1{
    font-size:clamp(34px,10vw,40px);
  }
}

/* HERO — accroche jaune */
.pj51-copy h1{
  color:#FFE99A;
}

/* ============================================================
   PARIJUSTE — HERO MARKET PREVIEW V2
   ============================================================ */

.pj52-market-card{
  width:100%;
  overflow:hidden;
  border:1px solid rgba(244,239,229,.11);
  border-radius:22px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.045),transparent 42%),
    rgba(5,29,21,.88);
  box-shadow:0 28px 70px rgba(0,0,0,.24);
}

/* Header */

.pj52-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:17px 22px;
  border-bottom:1px solid rgba(244,239,229,.08);
}

.pj52-league{
  display:flex;
  align-items:center;
  gap:8px;
  color:#a9bbb2;
  font-size:11px;
  font-weight:850;
  letter-spacing:.09em;
}

.pj52-flag{
  font-size:17px;
  line-height:1;
}

.pj52-market-pill{
  padding:6px 9px;
  border:1px solid rgba(98,234,165,.20);
  border-radius:999px;
  background:rgba(98,234,165,.07);
  color:#62eaa5;
  font-size:9px;
  font-weight:900;
  letter-spacing:.09em;
}

/* Fixture */

.pj52-fixture{
  display:grid;
  grid-template-columns:1fr 100px 1fr;
  align-items:center;
  padding:21px 28px 23px;
}

.pj52-team{
  display:flex;
  align-items:center;
  gap:12px;
}

.pj52-team:last-child{
  flex-direction:row-reverse;
  text-align:right;
}

.pj52-team > strong{
  color:#edf5f1;
  font-size:15px;
  font-weight:800;
}

.pj52-crest{
  display:grid;
  flex:0 0 54px;
  width:54px;
  height:54px;
  place-items:center;
}

.pj52-crest img{
  display:block;
  max-width:50px;
  max-height:50px;
  object-fit:contain;
}

.pj52-fixture-center{
  display:grid;
  justify-items:center;
  gap:4px;
}

.pj52-fixture-center small{
  color:#70887d;
  font-size:9px;
  font-weight:800;
  letter-spacing:.04em;
  white-space:nowrap;
}

.pj52-fixture-center strong{
  color:#dce9e2;
  font-size:22px;
  font-weight:500;
}

/* Graph */

.pj52-chart{
  margin:0 20px;
  padding:17px 17px 13px;
  border:1px solid rgba(244,239,229,.075);
  border-radius:16px;
  background:rgba(255,255,255,.022);
}

.pj52-chart-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  margin-bottom:12px;
}

.pj52-chart-head > div{
  display:grid;
  gap:3px;
}

.pj52-chart-head small{
  color:#70887d;
  font-size:9px;
  font-weight:850;
  letter-spacing:.1em;
}

.pj52-chart-head strong{
  color:#e6f0eb;
  font-size:13px;
  font-weight:800;
}

.pj52-live-status{
  display:flex;
  align-items:center;
  gap:6px;
  color:#8fa59b;
  font-size:10px;
  font-weight:700;
}

.pj52-live-status i{
  display:block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#62eaa5;
  box-shadow:0 0 0 4px rgba(98,234,165,.09);
}

/* Plot */

.pj52-chart-area{
  position:relative;
  height:150px;
  padding-left:38px;
  padding-right:73px;
}

.pj52-axis{
  position:absolute;
  z-index:2;
  top:0;
  bottom:0;
  left:0;
  width:31px;
  display:flex;
  flex-direction:column;
  justify-content:space-around;
  color:#60776c;
  font-size:8px;
  font-weight:700;
}

.pj52-lines{
  position:absolute;
  top:0;
  right:73px;
  bottom:0;
  left:38px;
  width:calc(100% - 111px);
  height:150px;
  overflow:visible;
}

.pj52-grid-line{
  stroke:rgba(244,239,229,.07);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}

.pj52-area{
  fill:url(#pj52-area);
}

.pj52-line{
  fill:none;
  stroke-width:2.6;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}

.pj52-line--betclic{
  stroke:#62eaa5;
}

.pj52-line--unibet{
  stroke:#83b7ff;
}

.pj52-dot{
  stroke:#092017;
  stroke-width:2;
  vector-effect:non-scaling-stroke;
}

.pj52-dot--betclic{
  fill:#62eaa5;
}

.pj52-dot--unibet{
  fill:#83b7ff;
}

/* End labels */

.pj52-chart-label{
  position:absolute;
  right:0;
  display:grid;
  min-width:61px;
  gap:0;
  padding:5px 7px;
  border-radius:8px;
}

.pj52-chart-label span{
  font-size:8px;
  font-weight:750;
}

.pj52-chart-label strong{
  font-size:12px;
  font-weight:900;
}

.pj52-chart-label--betclic{
  top:27px;
  background:rgba(98,234,165,.09);
  color:#62eaa5;
}

.pj52-chart-label--unibet{
  top:72px;
  background:rgba(131,183,255,.08);
  color:#9bc4ff;
}

/* Time axis */

.pj52-times{
  display:flex;
  justify-content:space-between;
  margin:3px 73px 0 38px;
  color:#60776c;
  font-size:8px;
  font-weight:700;
}

.pj52-legend{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  margin-top:11px;
  padding-top:10px;
  border-top:1px solid rgba(244,239,229,.055);
  color:#81978d;
  font-size:9px;
  font-weight:700;
}

.pj52-legend span{
  display:flex;
  align-items:center;
  gap:6px;
}

.pj52-legend i{
  display:block;
  width:18px;
  height:2px;
  border-radius:999px;
}

.pj52-legend-betclic{
  background:#62eaa5;
}

.pj52-legend-unibet{
  background:#83b7ff;
}

/* Conclusion */

.pj52-conclusion{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  margin-top:18px;
  border-top:1px solid rgba(244,239,229,.075);
  background:rgba(244,239,229,.075);
}

.pj52-result{
  display:grid;
  gap:4px;
  padding:17px 21px 19px;
  background:#092219;
}

.pj52-result small{
  color:#62eaa5;
  font-size:10px;
  font-weight:900;
  letter-spacing:.1em;
}

.pj52-result strong{
  color:#f1f7f4;
  font-size:15px;
  font-weight:850;
}

.pj52-result > span{
  color:#70887d;
  font-size:10px;
  font-weight:650;
}

.pj52-result .pj52-up{
  color:#62eaa5;
}

/* Mobile */

@media(max-width:700px){

  .pj52-fixture{
    grid-template-columns:1fr 72px 1fr;
    padding:18px 16px 20px;
  }

  .pj52-team{
    flex-direction:column;
    text-align:center;
    gap:7px;
  }

  .pj52-team:last-child{
    flex-direction:column;
    text-align:center;
  }

  .pj52-crest{
    width:48px;
    height:48px;
    flex-basis:48px;
  }

  .pj52-crest img{
    max-width:44px;
    max-height:44px;
  }

  .pj52-chart{
    margin-left:12px;
    margin-right:12px;
    padding-left:12px;
    padding-right:12px;
  }

  .pj52-chart-area{
    padding-right:0;
  }

  .pj52-lines{
    right:0;
    width:calc(100% - 38px);
  }

  .pj52-chart-label{
    display:none;
  }

  .pj52-times{
    margin-right:0;
  }

}


/* ============================================================
   PARIJUSTE — COMMENT ÇA MARCHE / PRODUCT STORY
   ============================================================ */

.pj6-how{
  position:relative;
  padding:105px 0 120px;
  background:#182e24;
  border-top:1px solid rgba(244,239,229,.06);
}

.pj6-how-head{
  max-width:760px;
  margin:0 auto 55px;
  text-align:center;
}

.pj6-eyebrow{
  display:inline-block;
  margin-bottom:16px;
  color:#62eaa5;
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
}

.pj6-how-head h2{
  margin:0;
  color:#f4efe5;
  font-family:Inter,system-ui,sans-serif;
  font-size:clamp(34px,4vw,52px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.04em;
}

.pj6-how-head h2 span{
  color:#a8bcb1;
}

.pj6-how-head p{
  max-width:620px;
  margin:20px auto 0;
  color:#8fa59b;
  font-size:15px;
  line-height:1.7;
}

/* Layout */

.pj6-steps{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}

.pj6-step{
  position:relative;
  overflow:hidden;
  min-width:0;
  padding:30px;
  border:1px solid rgba(244,239,229,.09);
  border-radius:20px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),transparent 45%),
    rgba(5,29,21,.58);
}

.pj6-step-number{
  position:absolute;
  top:22px;
  right:25px;
  color:rgba(98,234,165,.22);
  font-size:36px;
  font-weight:900;
  letter-spacing:-.06em;
}

.pj6-step-copy{
  position:relative;
  z-index:1;
  max-width:480px;
}

.pj6-step-copy > span{
  display:block;
  margin-bottom:8px;
  color:#62eaa5;
  font-size:10px;
  font-weight:900;
  letter-spacing:.11em;
}

.pj6-step-copy h3{
  margin:0;
  color:#edf5f1;
  font-size:21px;
  font-weight:750;
  line-height:1.22;
  letter-spacing:-.025em;
}

.pj6-step-copy p{
  margin:10px 0 0;
  color:#879d92;
  font-size:13px;
  line-height:1.6;
}

/* 01 — Leagues */

.pj6-leagues{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:7px;
  margin-top:28px;
}

.pj6-league{
  display:grid;
  justify-items:center;
  align-content:center;
  gap:7px;
  min-height:77px;
  padding:10px 5px;
  border:1px solid rgba(244,239,229,.07);
  border-radius:11px;
  background:rgba(255,255,255,.025);
  text-align:center;
}

.pj6-league span{
  font-size:22px;
  line-height:1;
}

.pj6-league strong{
  color:#b8c9c0;
  font-size:9px;
  font-weight:800;
  line-height:1.25;
}

/* 02 — Markets */

.pj6-markets{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:27px;
}

.pj6-markets span{
  padding:8px 10px;
  border:1px solid rgba(98,234,165,.13);
  border-radius:9px;
  background:rgba(98,234,165,.045);
  color:#b7c9c0;
  font-size:10px;
  font-weight:750;
}

/* 03 — Monitoring */

.pj6-step--watch{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(420px,1.15fr);
  gap:45px;
  align-items:center;
  padding:38px;
}

.pj6-watch-copy{
  min-width:0;
}

.pj6-step--watch .pj6-step-copy h3{
  font-size:26px;
}

.pj6-alert{
  display:flex;
  align-items:center;
  gap:13px;
  margin-top:27px;
  padding:14px;
  border:1px solid rgba(98,234,165,.15);
  border-radius:13px;
  background:rgba(98,234,165,.055);
}

.pj6-alert-icon{
  display:grid;
  flex:0 0 38px;
  width:38px;
  height:38px;
  place-items:center;
  border-radius:10px;
  background:rgba(98,234,165,.12);
  color:#62eaa5;
  font-size:17px;
}

.pj6-alert > div:last-child{
  display:grid;
  gap:2px;
}

.pj6-alert small{
  color:#62eaa5;
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
}

.pj6-alert strong{
  color:#dce9e2;
  font-size:12px;
  font-weight:800;
}

.pj6-alert span{
  color:#70887d;
  font-size:9px;
  line-height:1.4;
}

/* Monitoring demo */

.pj6-watch-demo{
  overflow:hidden;
  border:1px solid rgba(244,239,229,.085);
  border-radius:16px;
  background:rgba(3,22,15,.55);
}

.pj6-watch-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 17px;
  border-bottom:1px solid rgba(244,239,229,.065);
}

.pj6-watch-head span{
  color:#82998e;
  font-size:9px;
  font-weight:850;
  letter-spacing:.1em;
}

.pj6-watch-head small{
  color:#dce9e2;
  font-size:10px;
  font-weight:750;
}

.pj6-mini-chart{
  height:130px;
  padding:15px 17px 0;
}

.pj6-mini-chart svg{
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
}

.pj6-mini-chart line{
  stroke:rgba(244,239,229,.06);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}

.pj6-mini-chart path{
  fill:none;
  stroke-width:2.5;
  stroke-linecap:round;
  vector-effect:non-scaling-stroke;
}

.pj6-chart-betclic{
  stroke:#62eaa5;
}

.pj6-chart-unibet{
  stroke:#83b7ff;
}

.pj6-bookmakers{
  display:flex;
  align-items:center;
  gap:22px;
  padding:7px 17px 15px;
  color:#849a90;
  font-size:9px;
}

.pj6-bookmakers span{
  display:flex;
  align-items:center;
  gap:6px;
}

.pj6-bookmakers i{
  display:block;
  width:7px;
  height:7px;
  border-radius:50%;
}

.pj6-dot-betclic{
  background:#62eaa5;
}

.pj6-dot-unibet{
  background:#83b7ff;
}

.pj6-bookmakers strong{
  margin-left:2px;
  color:#dce9e2;
  font-size:11px;
}

.pj6-decision{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  border-top:1px solid rgba(244,239,229,.07);
  background:rgba(244,239,229,.07);
}

.pj6-decision > div{
  display:grid;
  gap:4px;
  padding:13px 17px;
  background:#092219;
}

.pj6-decision small{
  color:#62eaa5;
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
}

.pj6-decision strong{
  color:#e7f1ec;
  font-size:12px;
  font-weight:850;
}

/* 04 — Bankroll */

.pj6-step--bankroll{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(480px,1.2fr);
  gap:50px;
  align-items:center;
  padding:38px;
}

.pj6-step--bankroll .pj6-step-copy h3{
  font-size:25px;
}

.pj6-bankroll-demo{
  overflow:hidden;
  border:1px solid rgba(244,239,229,.08);
  border-radius:15px;
  background:rgba(3,22,15,.5);
}

.pj6-bankroll-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:14px 17px;
  border-bottom:1px solid rgba(244,239,229,.06);
}

.pj6-bankroll-row > div{
  display:grid;
  gap:2px;
}

.pj6-bankroll-row small{
  color:#62eaa5;
  font-size:8px;
  font-weight:900;
  letter-spacing:.09em;
}

.pj6-bankroll-row strong{
  color:#aebfb6;
  font-size:11px;
  font-weight:750;
}

.pj6-bankroll-row > span{
  color:#edf5f1;
  font-size:15px;
  font-weight:850;
}

.pj6-performance{
  display:grid;
  grid-template-columns:repeat(3,1fr);
}

.pj6-performance > div{
  display:grid;
  gap:4px;
  padding:15px 17px;
  border-right:1px solid rgba(244,239,229,.06);
}

.pj6-performance > div:last-child{
  border-right:0;
}

.pj6-performance small{
  color:#657c71;
  font-size:7px;
  font-weight:850;
  letter-spacing:.08em;
}

.pj6-performance strong{
  color:#dce9e2;
  font-size:12px;
  font-weight:850;
}

.pj6-performance > div:nth-child(2) strong{
  color:#62eaa5;
}

/* Responsive */

@media(max-width:900px){

  .pj6-steps{
    grid-template-columns:1fr;
  }

  .pj6-step--watch,
  .pj6-step--bankroll{
    grid-column:auto;
    grid-template-columns:1fr;
    gap:30px;
  }

}

@media(max-width:600px){

  .pj6-how{
    padding:75px 0 85px;
  }

  .pj6-how-head{
    margin-bottom:38px;
  }

  .pj6-how-head h2{
    font-size:34px;
  }

  .pj6-step,
  .pj6-step--watch,
  .pj6-step--bankroll{
    padding:23px;
  }

  .pj6-leagues{
    grid-template-columns:repeat(2,1fr);
  }

  .pj6-league:last-child{
    grid-column:1 / -1;
  }

  .pj6-performance{
    grid-template-columns:1fr;
  }

  .pj6-performance > div{
    border-right:0;
    border-bottom:1px solid rgba(244,239,229,.06);
  }

  .pj6-performance > div:last-child{
    border-bottom:0;
  }

}


/* COMMENT ÇA MARCHE — titre + suppression numéros */

.pj6-eyebrow{
  margin-bottom:18px;
  color:#62eaa5;
  font-size:18px;
  font-weight:850;
  letter-spacing:.10em;
}

.pj6-step-number{
  display:none !important;
}


/* Point de timing sélectionné par PariJuste */

.pj6-mini-chart{
  position:relative;
}

.pj6-pick-line{
  stroke:rgba(255,233,154,.40) !important;
  stroke-width:1 !important;
  stroke-dasharray:4 5;
  vector-effect:non-scaling-stroke;
}

.pj6-pick-halo{
  fill:rgba(255,233,154,.16);
  stroke:rgba(255,233,154,.25);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}

.pj6-pick-point{
  fill:#FFE99A;
  stroke:#092219;
  stroke-width:2;
  vector-effect:non-scaling-stroke;
}

.pj6-pick-label{
  position:absolute;
  top:6px;
  left:75%;
  display:grid;
  gap:1px;
  padding:5px 8px;
  border:1px solid rgba(255,233,154,.18);
  border-radius:7px;
  background:rgba(9,34,25,.94);
  transform:translateX(-50%);
  white-space:nowrap;
  box-shadow:0 7px 20px rgba(0,0,0,.16);
}

.pj6-pick-label small{
  color:#FFE99A;
  font-size:7px;
  font-weight:900;
  letter-spacing:.1em;
}

.pj6-pick-label strong{
  color:#f4efe5;
  font-size:9px;
  font-weight:800;
}


/* ============================================================
   PARIJUSTE — SANS / AVEC PARIJUSTE
   ============================================================ */

.pj7-compare{
  position:relative;
  padding:110px 0 115px;
  background:
    radial-gradient(circle at 82% 35%,rgba(98,234,165,.07),transparent 28rem),
    #20362b;
  border-top:1px solid rgba(244,239,229,.055);
}

.pj7-head{
  max-width:760px;
  margin:0 auto 52px;
  text-align:center;
}

.pj7-eyebrow{
  display:inline-block;
  margin-bottom:18px;
  color:#62eaa5;
  font-size:18px;
  font-weight:850;
  letter-spacing:.10em;
}

.pj7-head h2{
  margin:0;
  color:#f4efe5;
  font-family:Inter,system-ui,sans-serif;
  font-size:clamp(36px,4vw,52px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.04em;
}

.pj7-head h2 span{
  color:#a8bcb1;
}

.pj7-head p{
  max-width:610px;
  margin:20px auto 0;
  color:#8fa59b;
  font-size:15px;
  line-height:1.7;
}

/* Cards */

.pj7-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  align-items:stretch;
}

.pj7-card{
  position:relative;
  overflow:hidden;
  display:flex;
  min-width:0;
  flex-direction:column;
  border-radius:20px;
}

.pj7-card--without{
  border:1px solid rgba(190,190,180,.10);
  background:
    linear-gradient(145deg,rgba(255,255,255,.025),transparent 45%),
    rgba(20,37,30,.72);
}

.pj7-card--with{
  border:1px solid rgba(98,234,165,.18);
  background:
    radial-gradient(circle at 80% 10%,rgba(98,234,165,.08),transparent 18rem),
    linear-gradient(145deg,rgba(255,255,255,.035),transparent 45%),
    rgba(5,29,21,.84);
  box-shadow:0 25px 65px rgba(0,0,0,.14);
}

.pj7-card-head{
  display:grid;
  gap:12px;
  padding:25px 26px 22px;
  border-bottom:1px solid rgba(244,239,229,.065);
}

.pj7-card-head > strong{
  color:#e5eee9;
  font-size:18px;
  font-weight:750;
  letter-spacing:-.02em;
}

.pj7-status{
  width:max-content;
  padding:6px 9px;
  border-radius:999px;
  font-size:9px;
  font-weight:900;
  letter-spacing:.1em;
}

.pj7-status--without{
  border:1px solid rgba(196,177,159,.12);
  background:rgba(196,177,159,.055);
  color:#9d9389;
}

.pj7-status--with{
  border:1px solid rgba(98,234,165,.20);
  background:rgba(98,234,165,.075);
  color:#62eaa5;
}

/* Sans PariJuste */

.pj7-manual{
  padding:25px 26px 21px;
}

.pj7-manual-row{
  display:grid;
  grid-template-columns:48px 1fr 28px;
  gap:13px;
  align-items:center;
}

.pj7-time{
  color:#657b71;
  font-size:10px;
  font-weight:800;
}

.pj7-manual-row > div{
  display:grid;
  gap:3px;
}

.pj7-manual-row strong{
  color:#aebdb5;
  font-size:12px;
  font-weight:750;
}

.pj7-manual-row small{
  color:#657b71;
  font-size:9px;
  line-height:1.4;
}

.pj7-check,
.pj7-question{
  display:grid;
  width:25px;
  height:25px;
  place-items:center;
  border-radius:50%;
  font-size:10px;
  font-weight:900;
}

.pj7-check{
  border:1px solid rgba(148,162,154,.12);
  background:rgba(148,162,154,.055);
  color:#82948b;
}

.pj7-question{
  border:1px solid rgba(255,233,154,.11);
  background:rgba(255,233,154,.04);
  color:#a89d75;
}

.pj7-manual-line{
  width:1px;
  height:25px;
  margin:5px 0 5px 12px;
  background:rgba(244,239,229,.075);
}

/* Avec PariJuste — sélection */

.pj7-selection{
  margin:22px 24px 0;
  overflow:hidden;
  border:1px solid rgba(244,239,229,.075);
  border-radius:12px;
  background:rgba(255,255,255,.022);
}

.pj7-selection-top{
  display:flex;
  justify-content:space-between;
  gap:15px;
  padding:9px 12px;
  border-bottom:1px solid rgba(244,239,229,.055);
}

.pj7-selection-top span{
  color:#6e857a;
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
}

.pj7-selection-top small{
  color:#62796e;
  font-size:8px;
  font-weight:750;
}

.pj7-selection-match{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:12px;
}

.pj7-selection-match > div{
  display:grid;
  gap:3px;
}

.pj7-selection-match small{
  color:#82998e;
  font-size:9px;
}

.pj7-selection-match strong{
  color:#e5eee9;
  font-size:12px;
  font-weight:800;
}

.pj7-selection-match > span{
  padding:5px 8px;
  border-radius:999px;
  background:rgba(98,234,165,.08);
  color:#62eaa5;
  font-size:8px;
  font-weight:850;
}

/* Avec PariJuste — monitoring */

.pj7-monitoring{
  margin:12px 24px 0;
  padding:13px 13px 10px;
  border:1px solid rgba(244,239,229,.075);
  border-radius:12px;
  background:rgba(3,22,15,.48);
}

.pj7-monitoring-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  margin-bottom:5px;
}

.pj7-monitoring-head span{
  color:#62eaa5;
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
}

.pj7-monitoring-head small{
  color:#72897e;
  font-size:8px;
  font-weight:700;
}

.pj7-monitoring-chart{
  height:105px;
}

.pj7-monitoring-chart svg{
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
}

.pj7-monitoring-chart line{
  stroke:rgba(244,239,229,.055);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}

.pj7-monitoring-chart path{
  fill:none;
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}

.pj7-line-betclic{
  stroke:#62eaa5;
}

.pj7-line-unibet{
  stroke:#83b7ff;
}

.pj7-monitoring-chart .pj7-pick-line{
  stroke:rgba(255,233,154,.42);
  stroke-width:1;
  stroke-dasharray:4 5;
}

.pj7-pick-halo{
  fill:rgba(255,233,154,.16);
  stroke:rgba(255,233,154,.22);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}

.pj7-pick-point{
  fill:#FFE99A;
  stroke:#092219;
  stroke-width:2;
  vector-effect:non-scaling-stroke;
}

.pj7-monitoring-times{
  display:flex;
  justify-content:space-between;
  color:#5d756a;
  font-size:7px;
  font-weight:700;
}

/* Notification */

.pj7-notification{
  display:flex;
  align-items:center;
  gap:12px;
  margin:12px 24px 22px;
  padding:12px;
  border:1px solid rgba(255,233,154,.14);
  border-radius:12px;
  background:rgba(255,233,154,.045);
}

.pj7-mail{
  display:grid;
  flex:0 0 36px;
  width:36px;
  height:36px;
  place-items:center;
  border-radius:9px;
  background:rgba(255,233,154,.09);
  color:#FFE99A;
  font-size:15px;
}

.pj7-notification > div:last-child{
  display:grid;
  gap:2px;
}

.pj7-notification small{
  color:#FFE99A;
  font-size:7px;
  font-weight:900;
  letter-spacing:.08em;
}

.pj7-notification strong{
  color:#e8f0ec;
  font-size:11px;
  font-weight:800;
}

.pj7-notification span{
  color:#758c81;
  font-size:8px;
  line-height:1.4;
}

/* Résultat des deux colonnes */

.pj7-card-result{
  display:grid;
  gap:4px;
  margin-top:auto;
  padding:17px 25px 19px;
  border-top:1px solid rgba(244,239,229,.065);
}

.pj7-card-result small{
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
}

.pj7-card-result strong{
  font-size:12px;
  font-weight:800;
  line-height:1.45;
}

.pj7-card-result--without{
  background:rgba(0,0,0,.07);
}

.pj7-card-result--without small{
  color:#7b877f;
}

.pj7-card-result--without strong{
  color:#9eaaa4;
}

.pj7-card-result--with{
  background:rgba(98,234,165,.035);
}

.pj7-card-result--with small{
  color:#62eaa5;
}

.pj7-card-result--with strong{
  color:#e8f1ec;
}

/* Résumé */

.pj7-summary{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:32px;
  margin:37px auto 0;
}

.pj7-summary > div{
  display:flex;
  align-items:baseline;
  gap:8px;
}

.pj7-summary strong{
  color:#FFE99A;
  font-size:25px;
  font-weight:800;
  letter-spacing:-.04em;
}

.pj7-summary span{
  color:#82988e;
  font-size:11px;
  font-weight:700;
}

.pj7-summary > i{
  display:block;
  width:1px;
  height:25px;
  background:rgba(244,239,229,.10);
}

/* Responsive */

@media(max-width:850px){

  .pj7-grid{
    grid-template-columns:1fr;
  }

  .pj7-summary{
    align-items:flex-start;
    flex-direction:column;
    gap:14px;
    width:max-content;
  }

  .pj7-summary > i{
    display:none;
  }

}

@media(max-width:600px){

  .pj7-compare{
    padding:75px 0 85px;
  }

  .pj7-head{
    margin-bottom:38px;
  }

  .pj7-head h2{
    font-size:34px;
  }

  .pj7-card-head,
  .pj7-manual{
    padding-left:20px;
    padding-right:20px;
  }

  .pj7-selection,
  .pj7-monitoring,
  .pj7-notification{
    margin-left:18px;
    margin-right:18px;
  }

  .pj7-manual-row{
    grid-template-columns:42px 1fr 26px;
  }

  .pj7-summary{
    width:100%;
  }

}


/* Axe des cotes — graphique Sans / Avec */

.pj7-monitoring-chart{
  position:relative;
  margin-left:31px;
}

.pj7-y-axis{
  position:absolute;
  top:0;
  bottom:0;
  left:-31px;
  display:flex;
  width:25px;
  flex-direction:column;
  justify-content:space-around;
  color:#61796e;
  font-size:7px;
  font-weight:750;
  line-height:1;
  text-align:right;
}

.pj7-monitoring-times{
  margin-left:31px;
}