.showcase{padding:110px 0;background:radial-gradient(circle at 85% 5%,#0b567044,transparent 32%),linear-gradient(145deg,#061426,#091b31);}
.showcase-head{display:grid;grid-template-columns:1.05fr .75fr;gap:100px;align-items:end;margin-bottom:54px}
.showcase-head h2{max-width:720px;margin:12px 0 0;font-size:clamp(3rem,5.4vw,5.5rem);font-weight:900;line-height:.96;letter-spacing:-.06em}
.showcase-intro{padding-bottom:7px}.showcase-intro p{margin:0 0 24px;color:#b8c8d9;font-size:1.08rem}.showcase-intro a{display:inline-flex;gap:12px;align-items:center;color:#7be7ff;font-weight:850}.showcase-intro a span{font-size:1.25rem;transition:transform .2s}.showcase-intro a:hover span{transform:translateX(5px)}
.showcase-grid{gap:18px}.showcase-card{position:relative;min-height:310px;padding:30px;border:1px solid #ffffff20;border-left:0!important;background:linear-gradient(145deg,#ffffff0e,#ffffff06);overflow:hidden}
.showcase-card:before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--project-color)}.showcase-card:after{content:"";position:absolute;width:170px;height:170px;right:-90px;top:-100px;border-radius:50%;background:var(--project-color);opacity:.09;filter:blur(2px)}
.showcase-card:nth-child(1){--project-color:var(--sky)}.showcase-card:nth-child(2){--project-color:var(--coral)}.showcase-card:nth-child(3){--project-color:var(--sun)}.showcase-card:nth-child(4){--project-color:var(--aqua)}
.showcase-card:hover{transform:translateY(-5px);border-color:#ffffff35;background:linear-gradient(145deg,#ffffff14,#ffffff09)}.project-top{display:flex;justify-content:space-between;align-items:center}.project-index{font-size:.78rem;font-weight:900;letter-spacing:.12em;color:var(--project-color)}.project-top small{padding:6px 10px;border:1px solid #ffffff1f;border-radius:999px;color:#cae1ed;font-size:.7rem;letter-spacing:.07em}
.showcase-card h3{margin:34px 0 9px;font-size:1.65rem}.showcase-card p{max-width:490px;margin:0;color:#b9cadd}.project-tags{display:flex;flex-wrap:wrap;gap:7px;margin:22px 0}.project-tags span{border-radius:7px;background:#ffffff0c;padding:5px 9px;color:#91a9bc;font-size:.72rem;font-weight:750}
.project-link{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:18px;border-top:1px solid #ffffff16;color:#fff;font-size:.86rem;font-weight:800}.project-link b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--project-color);color:#071427;transition:transform .2s}.project-link:hover b{transform:translateX(4px)}
.showcase-proof{display:flex;align-items:center;gap:54px;margin-top:30px;padding:25px 28px;border:1px solid #ffffff1c;border-radius:20px;background:#ffffff08}.showcase-proof>div{display:flex;flex-direction:column}.showcase-proof b{color:#fff;font-size:1.25rem}.showcase-proof span{color:#91a8bc;font-size:.8rem}.showcase-proof .btn{margin-left:auto}
.portfolio-item{scroll-margin-top:105px}
@media(max-width:850px){.showcase-head{grid-template-columns:1fr;gap:25px}.showcase-head h2{font-size:3.4rem}.showcase-proof{align-items:flex-start;flex-direction:column;gap:18px}.showcase-proof .btn{margin-left:0}.showcase-card{min-height:285px}}
@media(max-width:520px){.showcase{padding:80px 0}.showcase-head h2{font-size:2.8rem}.project-top{align-items:flex-start;gap:12px}.project-top small{text-align:right}.showcase-card{padding:25px}}

/* Aperçus visuels anonymisés des réalisations */
.showcase-card-visual{padding:0!important;overflow:hidden;display:block!important}
.project-thumb{position:relative;display:block;height:190px;overflow:hidden;background:#dce8f2;border-bottom:1px solid rgba(255,255,255,.12)}
.project-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,27,48,.03),rgba(8,27,48,.42))}
.project-thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .45s ease,filter .45s ease}
.project-thumb span{position:absolute;z-index:1;left:18px;bottom:14px;padding:7px 10px;border-radius:999px;background:rgba(7,24,43,.78);border:1px solid rgba(255,255,255,.18);color:#fff;font-size:.68rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;backdrop-filter:blur(6px)}
.showcase-card-visual:hover .project-thumb img{transform:scale(1.035);filter:saturate(1.08)}
.project-content{display:flex;flex-direction:column;min-height:345px;padding:28px 30px 25px}
.project-content .project-link{margin-top:auto}
@media(max-width:700px){.project-thumb{height:165px}.project-content{min-height:0;padding:24px 22px}}

/* Variante intégrée : la vignette vit dans la carte, à côté du contenu */
@media(min-width:851px){
  .showcase-card-visual{display:grid!important;grid-template-columns:minmax(0,1fr) 190px;align-items:start;min-height:365px;padding:0!important}
  .showcase-card-visual .project-thumb{grid-column:2;grid-row:1;height:142px;margin:27px 25px 0 4px;border:1px solid rgba(255,255,255,.16);border-radius:15px;box-shadow:0 15px 34px rgba(0,0,0,.22)}
  .showcase-card-visual .project-thumb span{left:10px;bottom:9px;padding:5px 7px;font-size:.55rem}
  .showcase-card-visual .project-content{grid-column:1;grid-row:1;min-height:365px;padding:29px 12px 26px 30px}
  .showcase-card-visual .project-top{min-height:28px}
  .showcase-card-visual .project-top small{position:absolute;right:25px;top:184px}
  .showcase-card-visual h3{margin-top:42px}
}
@media(min-width:851px) and (max-width:1100px){
  .showcase-card-visual{grid-template-columns:minmax(0,1fr) 155px}
  .showcase-card-visual .project-thumb{height:118px;margin-right:20px}
  .showcase-card-visual .project-top small{right:20px;top:160px}
}