html{overflow-x:hidden}
h1{font-family:var(--serif);font-size:clamp(2.8rem,5.2vw,5.8rem);font-weight:800;line-height:.9;letter-spacing:-.05em}
h1 em{font-style:normal;background:var(--lime);color:var(--ink);display:inline-block;padding:0 .12em;-webkit-text-stroke:none}
.sh-l h1 em{animation:resultatPulse 2.6s ease-in-out infinite}
@keyframes resultatPulse{0%,100%{transform:scale(1);filter:drop-shadow(0 0 0 rgba(200,245,59,0))}50%{transform:scale(1.05);filter:drop-shadow(0 0 28px rgba(200,245,59,.7))}}
@media (prefers-reduced-motion: reduce){.sh-l h1 em{animation:none}}
h2{font-family:var(--serif);font-size:clamp(2rem,3.5vw,3.5rem);font-weight:800;letter-spacing:-.05em;line-height:1.02}
h2 mark{background:var(--lime);color:var(--ink);padding:0 .15em}
h2.wh{color:#fff}

.studio-hero{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;padding-top:68px}
.sh-l{display:flex;flex-direction:column;justify-content:flex-end;padding:4rem 2.5rem 4.5rem;min-width:0;overflow:hidden}
.sh-r{background:var(--card);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:4rem 2.5rem}
.sh-bg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:28vw;font-weight:800;color:rgba(0,0,0,.04);pointer-events:none;user-select:none}
.sh-bg::before{content:'al';letter-spacing:-.06em}
.sh-bg::after{content:'t';letter-spacing:-.06em;margin-left:.11em}
.sh-sub{font-size:.95rem;font-weight:300;color:var(--dust);line-height:1.78;max-width:460px;margin-bottom:2.2rem;margin-top:1.6rem}
.sh-btns{display:flex;gap:.8rem;flex-wrap:wrap;margin-bottom:1.4rem}.sh-btns .btn{flex:1;justify-content:center;text-align:center}
.sh-badges{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.4rem}
.badge{display:inline-flex;align-items:center;gap:.4rem;font-size:.72rem;font-weight:500;color:#3d3d38;background:var(--card);border:1px solid rgba(0,0,0,.08);padding:.3rem .75rem;border-radius:2rem}
.badge svg{width:12px;height:12px;stroke:var(--ink);fill:none;stroke-width:2;stroke-linecap:round;flex-shrink:0}

.about-bg{padding:6rem 2rem;background:var(--paper)}
.about-in{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center}
.about-stats{display:grid;grid-template-columns:1fr 1fr;gap:1.5px;background:rgba(0,0,0,.09);margin-top:3rem}
.stat-card{background:var(--paper);padding:1.8rem 1rem;text-align:center;min-width:0;overflow:hidden}
.stat-n{font-family:var(--serif);font-size:clamp(1.8rem,6vw,2.8rem);font-weight:800;color:var(--ink);letter-spacing:-.05em;line-height:1}
.stat-l{font-size:.78rem;font-weight:300;color:var(--dust);margin-top:.3rem}
.about-txt p:not(.tag){font-size:.92rem;font-weight:300;color:var(--dust);line-height:1.82;margin-bottom:1rem}
.about-txt p strong{font-weight:600;color:var(--ink)}

.valeurs-bg{background:var(--ink);padding:5.5rem 2rem}
.valeurs-in{max-width:1280px;margin:0 auto}
.valeurs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5px;background:rgba(255,255,255,.06);margin-top:3rem}
.val-card{background:var(--ink);padding:2.2rem;position:relative;overflow:hidden;transition:background .26s}
.val-card::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:2.5px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .28s}
.val-card:hover{background:#161616}
.val-card:hover::after{transform:scaleX(1)}
.val-n{font-family:var(--serif);font-size:2.5rem;font-weight:800;color:var(--lime);letter-spacing:-.05em;line-height:1;margin-bottom:.6rem}
.val-t{font-family:var(--serif);font-size:1.1rem;font-weight:700;color:#fff;margin-bottom:.6rem;letter-spacing:-.02em}
.val-d{font-size:.82rem;font-weight:300;color:rgba(255,255,255,.42);line-height:1.68}

.real-bg{padding:5.5rem 2rem;background:var(--paper);border-top:1.5px solid rgba(0,0,0,.08)}
.real-in{max-width:1280px;margin:0 auto}
.real-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3rem}

/* Réalisations : lignes de 3 cartes, bouton « Voir plus » en dessous */
.real-more--bottom{text-align:center;margin-top:2rem}
.real-more--bottom .btn{min-width:min(100%,14rem);justify-content:center}
.real-more--bottom:has(> #realisationsShowMore[hidden]){display:none;margin:0}

@media (min-width:601px){
  #realisations-groups{display:flex;flex-direction:column;gap:1.5rem;margin-top:1.5rem}
  #realisations-groups .real-row-group.real-grid{margin-top:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
  #realisations-groups .real-row-group[hidden]{display:none!important}
}
@media (max-width:600px){
  .real-more--bottom{display:none}
  #realisations-groups{display:flex;flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:.85rem;margin-top:1.25rem;padding-bottom:.5rem;scrollbar-width:none}
  #realisations-groups::-webkit-scrollbar{display:none}
  #realisations-groups .real-row-group{display:contents!important}
  #realisations-groups .real-row-group[hidden]{display:contents!important}
  #realisations-groups .real-card{width:78vw;flex-shrink:0;scroll-snap-align:start}
  .real-card,.real-card:hover,.real-card:active,.real-card:focus{transform:none!important;box-shadow:none!important;border-radius:.5rem!important}
}
.real-card{background:var(--card);border-radius:.5rem;overflow:hidden;transition:transform .22s,box-shadow .22s}
a.real-card{display:block;text-decoration:none;color:inherit}
.real-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.1)}
.real-img{height:200px;background:var(--ink);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.real-img img.real-img-photo{width:100%;height:100%;object-fit:cover;display:block}
.real-img-logo{position:absolute;top:.6rem;right:.6rem;width:2.65rem;height:2.65rem;border-radius:50%;overflow:hidden;box-shadow:0 4px 14px rgba(0,0,0,.22);border:2px solid var(--lime);background:var(--card);z-index:1}
.real-img-logo img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}
.real-img-badge{z-index:1}
.real-img-txt{font-family:var(--serif);font-size:5rem;font-weight:800;color:rgba(255,255,255,.08);letter-spacing:-.06em}
.real-img-badge{position:absolute;top:.6rem;left:.6rem;max-width:calc(100% - 1.2rem);font-size:.58rem;font-weight:700;letter-spacing:.04em;line-height:1.25;text-transform:none;background:var(--lime);color:var(--ink);padding:.28rem .65rem;border-radius:2rem;text-align:left;word-wrap:break-word;hyphens:auto}
.real-body{padding:1.5rem}
.real-title{font-family:var(--serif);font-size:1rem;font-weight:700;color:var(--ink);letter-spacing:-.02em;margin-bottom:.4rem}
.real-desc{font-size:.8rem;font-weight:300;color:var(--dust);line-height:1.6;margin-bottom:1rem}
.real-tags{display:flex;flex-wrap:wrap;gap:.35rem}
.real-tag{font-size:.65rem;font-weight:500;color:var(--dust);background:var(--paper);padding:.2rem .55rem;border-radius:2rem;border:1px solid rgba(0,0,0,.08)}

.proc-bg{background:var(--ink);padding:5.5rem 2rem}
.proc-in{max-width:1280px;margin:0 auto}
.proc-steps{display:grid;grid-template-columns:repeat(4,1fr);border:1.5px solid rgba(255,255,255,.12);margin-top:3.2rem}
.ps{padding:2.1rem;border-right:1.5px solid rgba(255,255,255,.12)}
.ps:last-child{border-right:none}
.ps-n{font-family:var(--serif);font-size:2.8rem;font-weight:800;color:var(--lime);line-height:1;margin-bottom:.65rem;letter-spacing:-.05em}
.ps-t{font-family:var(--serif);font-size:1rem;font-weight:700;color:#fff;margin-bottom:.4rem;letter-spacing:-.02em}
.ps-d{font-size:.8rem;font-weight:300;color:rgba(255,255,255,.42);line-height:1.62}

.cta-band{background:var(--lime);padding:5.5rem 2rem}
.cta-band-in{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr auto;align-items:center;gap:3rem}
.cta-hl{font-family:var(--serif);font-size:clamp(2rem,3.8vw,3.8rem);font-weight:800;letter-spacing:-.05em;line-height:.93;color:var(--ink)}
.cta-hl em{font-style:normal;-webkit-text-stroke:2px var(--ink);color:transparent}
.cta-side{display:flex;flex-direction:column;gap:.65rem;align-items:flex-end}
.cta-note{font-size:.7rem;color:rgba(0,0,0,.42);text-align:right}

@media(max-width:960px){.studio-hero{grid-template-columns:1fr}.sh-r{display:none}.sh-btns{flex-direction:column;align-items:stretch}.sh-btns .btn{width:100%;justify-content:center;text-align:center;min-height:3.15rem}.sh-btns .btn.btn-ink{border:1.5px solid transparent}.about-in{grid-template-columns:1fr;gap:3rem}.valeurs-grid{grid-template-columns:1fr 1fr}.real-grid{grid-template-columns:1fr 1fr}.proc-steps{grid-template-columns:1fr 1fr}.ps{border-right:none;border-bottom:1.5px solid rgba(255,255,255,.12)}.ps:nth-child(odd){border-right:1.5px solid rgba(255,255,255,.12)}.ps:nth-last-child(-n+2){border-bottom:none}.cta-band-in{grid-template-columns:1fr}.cta-side{align-items:flex-start}}
@media(max-width:600px){
.studio-hero{min-height:auto}
.sh-l{padding:3.5rem 1.4rem}
.sh-badges{flex-direction:column;align-items:flex-start;flex-wrap:nowrap;gap:.45rem}
.sh-badges .badge{width:auto;max-width:100%}
.about-txt>.btn{font-size:.78rem;padding:.7rem 1.2rem;width:100%;justify-content:center}
.cta-side{align-items:center;text-align:center}
.sh-r{display:flex!important;min-height:260px;padding:2rem 1.4rem}
.about-bg{padding:4rem 1.4rem}
.about-stats{grid-template-columns:1fr 1fr}
.stat-card{padding:1.2rem .75rem}
.valeurs-bg{padding:4rem 1.4rem}
.real-bg{padding:4rem 1.4rem}
.proc-bg{padding:4rem 1.4rem}
.proc-steps{grid-template-columns:1fr}
.ps{border-right:none!important;border-bottom:1.5px solid rgba(255,255,255,.12)!important}
.ps:last-child{border-bottom:none!important}
.cta-band{padding:4rem 1.4rem}

.valeurs-grid,.real-grid{scrollbar-width:none;-ms-overflow-style:none}
.valeurs-grid::-webkit-scrollbar,.real-grid::-webkit-scrollbar{display:none;width:0;height:0}

.valeurs-grid{
  display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch;justify-content:flex-start;
  grid-template-columns:unset;gap:0;background:var(--ink);margin-top:3rem;
  width:calc(100% + 2.8rem);max-width:none;margin-left:-1.4rem;margin-right:-1.4rem;
  padding-left:max(1.4rem,env(safe-area-inset-left));padding-right:max(1.4rem,env(safe-area-inset-right));padding-bottom:0;box-sizing:border-box;
  overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;scroll-padding-inline:max(1.4rem,env(safe-area-inset-left))
}
.val-card{flex:0 0 min(83vw,19rem);max-width:min(83vw,19rem);scroll-snap-align:start;min-width:0;background:#161616}
.val-card::after{transform:scaleX(1)}
/* Traits fins entre cartes (équivalent au gap desktop), sans bande grise */
.val-card+.val-card{border-left:1.5px solid rgba(255,255,255,.06)}

.real-grid{
  display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch;
  grid-template-columns:unset;gap:.85rem;background:transparent;margin-top:3rem;
  width:calc(100% + 2.8rem);max-width:none;margin-left:-1.4rem;margin-right:-1.4rem;
  padding-left:max(1.4rem,env(safe-area-inset-left));padding-right:max(1.4rem,env(safe-area-inset-right));padding-bottom:.75rem;box-sizing:border-box;
  overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;scroll-padding-inline:max(1.4rem,env(safe-area-inset-left))
}
.real-card{flex:0 0 min(85vw,20rem);max-width:min(85vw,20rem);scroll-snap-align:start;min-width:0}
}

/* Styles déplacés depuis les attributs style="" des pages (à renommer librement selon vos conventions). */
.studio-s1{position:relative;z-index:2;width:min(220px,55%);aspect-ratio:1;border-radius:50%;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.18)}
.studio-s2{width:100%;height:auto;display:block;object-fit:cover}
.studio-s3{margin-top:1.5rem;font-size:.9rem;color:var(--dust);line-height:1.65}