/* =========================================================
   Portfolio 2026 V2 — image-first, vraies réalisations
   ========================================================= */
body.rb-theme-portfolio .rb-inner-hero{
  padding-bottom:clamp(2.6rem,4vw,4rem)!important;
}
body.rb-theme-portfolio .rb-inner-panel{
  background:radial-gradient(circle at 78% 12%,rgba(200,80,26,.24),transparent 12rem),linear-gradient(145deg,#17110E,#241A14)!important;
}
body.rb-theme-portfolio .rb-inner-content{
  gap:clamp(26px,3vw,40px)!important;
}
body.rb-theme-portfolio .rb-inner-content>.section-block{
  overflow:hidden!important;
}
body.rb-theme-portfolio .rb-portfolio-stage{
  padding:clamp(1.4rem,2.8vw,2.8rem)!important;
  background:rgba(255,249,239,.78)!important;
  box-shadow:0 28px 82px rgba(17,16,14,.07)!important;
}
body.rb-theme-portfolio .rb-portfolio-head,
body.rb-theme-portfolio .rb-more-work .block-head{
  align-items:end!important;
}
body.rb-theme-portfolio .rb-portfolio-kicker{
  display:inline-flex!important;
  align-items:center!important;
  gap:10px!important;
  margin:0 0 14px!important;
  color:#6E6257!important;
  -webkit-text-fill-color:#6E6257!important;
  font:800 .76rem/1 var(--body)!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
}
body.rb-theme-portfolio .rb-portfolio-kicker:before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--orange);
  box-shadow:0 0 0 6px rgba(200,80,26,.12);
}
body.rb-theme-portfolio .rb-portfolio-head h2 em,
body.rb-theme-portfolio .rb-more-work h2 em,
body.rb-theme-portfolio .rb-portfolio-method h2 em{
  color:var(--orange)!important;
  -webkit-text-fill-color:var(--orange)!important;
  font-style:normal!important;
}

/* ---------- Grands cas ---------- */
body.rb-theme-portfolio .rb-showcase-list{
  display:grid!important;
  gap:clamp(22px,3vw,34px)!important;
  margin-top:clamp(28px,4vw,48px)!important;
}
body.rb-theme-portfolio .rb-case-feature{
  display:grid!important;
  grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr)!important;
  gap:clamp(24px,3.4vw,48px)!important;
  align-items:center!important;
  padding:clamp(18px,2.4vw,30px)!important;
  border-radius:38px!important;
  border:1px solid rgba(17,16,14,.10)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.84),rgba(245,237,224,.66))!important;
  box-shadow:0 24px 70px rgba(17,16,14,.06)!important;
}
body.rb-theme-portfolio .rb-case-feature--reverse .rb-case-visual{
  order:2!important;
}
body.rb-theme-portfolio .rb-case-feature--reverse .rb-case-copy{
  order:1!important;
}
body.rb-theme-portfolio .rb-case-visual{
  position:relative!important;
  display:block!important;
  padding:clamp(16px,2vw,24px)!important;
  min-width:0!important;
  border-radius:30px!important;
  overflow:hidden!important;
  text-decoration:none!important;
  background:radial-gradient(circle at 82% 12%,rgba(200,80,26,.24),transparent 12rem),linear-gradient(145deg,#17110E,#2B2019)!important;
  box-shadow:0 24px 64px rgba(17,16,14,.14)!important;
}
body.rb-theme-portfolio .rb-case-visual:after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-78px;
  bottom:-84px;
  border-radius:50%;
  background:rgba(95,115,92,.18);
  pointer-events:none;
}
body.rb-theme-portfolio .rb-case-visual__badge{
  position:absolute!important;
  left:clamp(28px,3vw,40px)!important;
  bottom:clamp(28px,3vw,40px)!important;
  z-index:4!important;
  display:inline-flex!important;
  align-items:center!important;
  min-height:34px!important;
  padding:0 12px!important;
  border-radius:999px!important;
  background:rgba(17,16,14,.76)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font:800 .72rem/1 var(--body)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
}

/* ---------- Faux navigateur sobre autour de vraies captures ---------- */
body.rb-theme-portfolio .rb-browser{
  position:relative!important;
  z-index:2!important;
  overflow:hidden!important;
  border-radius:18px!important;
  border:1px solid rgba(17,16,14,.12)!important;
  background:#fff!important;
  box-shadow:0 22px 48px rgba(17,16,14,.18)!important;
}
body.rb-theme-portfolio .rb-browser__bar{
  height:36px!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:0 12px!important;
  background:#F3EFE8!important;
  border-bottom:1px solid rgba(17,16,14,.09)!important;
}
body.rb-theme-portfolio .rb-browser__bar>span{
  width:7px!important;
  height:7px!important;
  border-radius:50%!important;
  background:rgba(17,16,14,.22)!important;
}
body.rb-theme-portfolio .rb-browser__bar>span:first-child{
  background:var(--orange)!important;
}
body.rb-theme-portfolio .rb-browser__bar em{
  min-width:0!important;
  margin-left:7px!important;
  color:#776B60!important;
  -webkit-text-fill-color:#776B60!important;
  font:700 .66rem/1 var(--body)!important;
  font-style:normal!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
body.rb-theme-portfolio .rb-browser img{
  display:block!important;
  width:100%!important;
  height:clamp(250px,31vw,440px)!important;
  object-fit:cover!important;
  object-position:top center!important;
  background:#fff!important;
  transition:transform .4s ease!important;
}
body.rb-theme-portfolio .rb-case-visual:hover .rb-browser img,
body.rb-theme-portfolio .rb-case-card__visual:hover .rb-browser img{
  transform:scale(1.018)!important;
}

body.rb-theme-portfolio .rb-case-copy{
  min-width:0!important;
  padding:clamp(4px,1vw,10px)!important;
}
body.rb-theme-portfolio .rb-case-meta{
  margin:0 0 12px!important;
  color:#7A6D61!important;
  -webkit-text-fill-color:#7A6D61!important;
  font:800 .74rem/1.3 var(--body)!important;
  text-transform:uppercase!important;
  letter-spacing:.06em!important;
}
body.rb-theme-portfolio .rb-case-copy h3,
body.rb-theme-portfolio .rb-case-card__body h3{
  margin:0!important;
  color:#17110E!important;
  -webkit-text-fill-color:#17110E!important;
  font-family:var(--title)!important;
  font-size:clamp(2rem,3.5vw,3.7rem)!important;
  line-height:.98!important;
  letter-spacing:-.06em!important;
}
body.rb-theme-portfolio .rb-case-hook{
  margin:18px 0 0!important;
  color:#3F3831!important;
  -webkit-text-fill-color:#3F3831!important;
  font-size:clamp(1rem,1.14vw,1.12rem)!important;
  line-height:1.62!important;
}
body.rb-theme-portfolio .rb-case-chips{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin:20px 0 0!important;
}
body.rb-theme-portfolio .rb-case-chips span{
  display:inline-flex!important;
  align-items:center!important;
  min-height:31px!important;
  padding:0 11px!important;
  border-radius:999px!important;
  border:1px solid rgba(17,16,14,.11)!important;
  background:rgba(255,255,255,.64)!important;
  color:#51483F!important;
  -webkit-text-fill-color:#51483F!important;
  font:800 .69rem/1 var(--body)!important;
}
body.rb-theme-portfolio .rb-case-points{
  display:grid!important;
  gap:9px!important;
  margin:22px 0 0!important;
  padding:0!important;
  list-style:none!important;
}
body.rb-theme-portfolio .rb-case-points li{
  position:relative!important;
  margin:0!important;
  padding-left:20px!important;
  color:#574E45!important;
  font-size:.94rem!important;
  line-height:1.5!important;
}
body.rb-theme-portfolio .rb-case-points li:before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:.58em!important;
  width:7px!important;
  height:7px!important;
  border-radius:50%!important;
  background:var(--orange)!important;
}
body.rb-theme-portfolio .rb-case-link{
  display:inline-flex!important;
  align-items:center!important;
  gap:9px!important;
  margin-top:24px!important;
  color:#17110E!important;
  -webkit-text-fill-color:#17110E!important;
  font:800 .82rem/1 var(--body)!important;
  text-decoration:none!important;
}
body.rb-theme-portfolio .rb-case-link span{
  color:var(--orange)!important;
  -webkit-text-fill-color:var(--orange)!important;
  transition:transform .18s ease!important;
}
body.rb-theme-portfolio .rb-case-link:hover span{
  transform:translateX(4px)!important;
}

/* ---------- 4 projets intermédiaires ---------- */
body.rb-theme-portfolio .rb-case-pair-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:20px!important;
  margin-top:20px!important;
}
body.rb-theme-portfolio .rb-case-card{
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  overflow:hidden!important;
  border-radius:34px!important;
  border:1px solid rgba(17,16,14,.10)!important;
  background:rgba(255,253,247,.78)!important;
  box-shadow:0 20px 60px rgba(17,16,14,.055)!important;
}
body.rb-theme-portfolio .rb-case-card__visual{
  display:block!important;
  padding:18px 18px 0!important;
  text-decoration:none!important;
  background:linear-gradient(145deg,rgba(95,115,92,.11),rgba(200,80,26,.08))!important;
}
body.rb-theme-portfolio .rb-case-card__visual .rb-browser img{
  height:clamp(225px,23vw,330px)!important;
}
body.rb-theme-portfolio .rb-case-card__body{
  display:flex!important;
  flex:1!important;
  flex-direction:column!important;
  padding:24px!important;
}
body.rb-theme-portfolio .rb-case-card__body h3{
  font-size:clamp(1.65rem,2.4vw,2.45rem)!important;
}
body.rb-theme-portfolio .rb-case-card__body>p:not(.rb-case-meta){
  margin:14px 0 0!important;
  color:#554C43!important;
  -webkit-text-fill-color:#554C43!important;
  font-size:.96rem!important;
  line-height:1.58!important;
}
body.rb-theme-portfolio .rb-case-card__body .rb-case-link{
  margin-top:auto!important;
  padding-top:22px!important;
}

/* ---------- Réalisations secondaires ---------- */
body.rb-theme-portfolio .rb-more-work{
  padding:clamp(1.5rem,2.8vw,2.8rem)!important;
  background:rgba(232,224,208,.24)!important;
}
body.rb-theme-portfolio .rb-mini-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  margin-top:30px!important;
}
body.rb-theme-portfolio .rb-mini-project{
  position:relative!important;
  display:block!important;
  min-height:235px!important;
  overflow:hidden!important;
  border-radius:26px!important;
  border:1px solid rgba(17,16,14,.10)!important;
  background:#17110E!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  text-decoration:none!important;
  box-shadow:0 18px 42px rgba(17,16,14,.08)!important;
}
body.rb-theme-portfolio .rb-mini-project:after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(180deg,rgba(17,16,14,.02) 30%,rgba(17,16,14,.82) 100%)!important;
}
body.rb-theme-portfolio .rb-mini-project img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:top center!important;
  transition:transform .28s ease,filter .28s ease!important;
}
body.rb-theme-portfolio .rb-mini-project>span{
  position:absolute!important;
  z-index:2!important;
  left:18px!important;
  right:18px!important;
  bottom:18px!important;
}
body.rb-theme-portfolio .rb-mini-project strong{
  display:block!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-family:var(--title)!important;
  font-size:1.12rem!important;
  line-height:1.05!important;
  letter-spacing:-.035em!important;
}
body.rb-theme-portfolio .rb-mini-project em{
  display:block!important;
  margin-top:6px!important;
  color:rgba(255,255,255,.72)!important;
  -webkit-text-fill-color:rgba(255,255,255,.72)!important;
  font:700 .72rem/1.2 var(--body)!important;
  font-style:normal!important;
}
body.rb-theme-portfolio .rb-mini-project:hover img{
  transform:scale(1.035)!important;
  filter:saturate(1.05) contrast(1.03)!important;
}

body.rb-theme-portfolio .rb-portfolio-method{
  background:rgba(255,249,239,.66)!important;
}
body.rb-theme-portfolio .rb-portfolio-method .card{
  min-height:190px!important;
}
body.rb-theme-portfolio .section-cta{
  margin-top:8px!important;
  background:radial-gradient(circle at 88% 18%,rgba(200,80,26,.24),transparent 18rem),linear-gradient(145deg,#17110E,#241A14)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
body.rb-theme-portfolio .section-cta .cta-h,
body.rb-theme-portfolio .section-cta h2,
body.rb-theme-portfolio .section-cta .cta-h *{
  color:#FFF9EF!important;
  -webkit-text-fill-color:#FFF9EF!important;
  opacity:1!important;
}
body.rb-theme-portfolio .section-cta .cta-h em,
body.rb-theme-portfolio .section-cta h2 em{
  color:#E77735!important;
  -webkit-text-fill-color:#E77735!important;
  font-style:normal!important;
}
body.rb-theme-portfolio .section-cta .cta-right,
body.rb-theme-portfolio .section-cta .cta-right p{
  color:rgba(255,249,239,.82)!important;
  -webkit-text-fill-color:rgba(255,249,239,.82)!important;
  opacity:1!important;
}

@media(max-width:1050px){
  body.rb-theme-portfolio .rb-case-feature{
    grid-template-columns:1fr!important;
  }
  body.rb-theme-portfolio .rb-case-feature--reverse .rb-case-visual,
  body.rb-theme-portfolio .rb-case-feature--reverse .rb-case-copy{
    order:initial!important;
  }
  body.rb-theme-portfolio .rb-mini-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body.rb-theme-portfolio .rb-browser img{
    height:clamp(280px,50vw,460px)!important;
  }
}
@media(max-width:720px){
  body.rb-theme-portfolio .rb-portfolio-stage,
  body.rb-theme-portfolio .rb-more-work{
    padding:1.05rem!important;
  }
  body.rb-theme-portfolio .rb-case-feature{
    padding:12px!important;
    border-radius:28px!important;
    gap:18px!important;
  }
  body.rb-theme-portfolio .rb-case-visual{
    padding:10px!important;
    border-radius:22px!important;
  }
  body.rb-theme-portfolio .rb-browser{
    border-radius:13px!important;
  }
  body.rb-theme-portfolio .rb-browser__bar{
    height:31px!important;
  }
  body.rb-theme-portfolio .rb-browser img,
  body.rb-theme-portfolio .rb-case-card__visual .rb-browser img{
    height:245px!important;
  }
  body.rb-theme-portfolio .rb-case-visual__badge{
    left:20px!important;
    bottom:20px!important;
    max-width:calc(100% - 40px)!important;
  }
  body.rb-theme-portfolio .rb-case-copy{
    padding:10px 8px 14px!important;
  }
  body.rb-theme-portfolio .rb-case-copy h3{
    font-size:2.2rem!important;
  }
  body.rb-theme-portfolio .rb-case-pair-grid,
  body.rb-theme-portfolio .rb-mini-grid{
    grid-template-columns:1fr!important;
  }
  body.rb-theme-portfolio .rb-case-card{
    border-radius:28px!important;
  }
  body.rb-theme-portfolio .rb-case-card__visual{
    padding:12px 12px 0!important;
  }
  body.rb-theme-portfolio .rb-case-card__body{
    padding:20px!important;
  }
  body.rb-theme-portfolio .rb-mini-project{
    min-height:245px!important;
  }
}
@media(prefers-reduced-motion:reduce){
  body.rb-theme-portfolio .rb-browser img,
  body.rb-theme-portfolio .rb-mini-project img,
  body.rb-theme-portfolio .rb-case-link span{
    transition:none!important;
  }
}
