/* Nos créations — galerie animée (cercle → arc au scroll), vanilla JS/CSS */
.creations-hero{position:relative;height:280vh;background:var(--bg-alt);}
.creations-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.creations-stage{position:relative;width:100%;height:100%;perspective:1200px;z-index:1;}

.creations-intro-text,.creations-content-text{position:absolute;top:10%;left:50%;transform:translateX(-50%);text-align:center;width:max-content;max-width:88vw;padding:1.1rem 1.75rem;border-radius:20px;background:var(--card-bg-solid);border:1px solid var(--border);backdrop-filter:blur(6px);z-index:5;transition:opacity .5s ease, transform .5s ease, background-color .4s ease;pointer-events:none;}
.creations-intro-text h1{font-size:clamp(1.8rem,4.5vw,3rem);margin-bottom:0.5rem;}
.creations-intro-text p{color:var(--text-secondary);font-size:0.78rem;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;}
.creations-content-text{opacity:0;transform:translate(-50%,10px);}
.creations-content-text h2{font-size:clamp(1.6rem,4vw,2.4rem);margin-bottom:0.6rem;}
.creations-content-text p{color:var(--text-secondary);max-width:480px;margin:0 auto;font-size:0.92rem;}

.creation-card{position:absolute;top:50%;left:50%;width:78px;height:112px;margin-left:-39px;margin-top:-56px;cursor:pointer;transform-style:preserve-3d;z-index:1;}
.creation-card-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,.2,.2,1);}
.creation-card:hover .creation-card-inner{transform:rotateY(180deg);}
.creation-face{position:absolute;inset:0;border-radius:10px;overflow:hidden;backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0.4rem;box-shadow:0 12px 28px -12px rgba(11,18,32,0.4);}
.creation-face.front{color:#fff;}
.creation-face.front .creation-sector{font-size:0.52rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;opacity:0.85;}
.creation-face.front .creation-title{font-size:0.62rem;font-weight:700;margin-top:0.25rem;line-height:1.2;}
.creation-face.back{background:var(--bg-dark);transform:rotateY(180deg);border:1px solid rgba(255,255,255,0.15);}
.creation-face.back .creation-back-label{font-size:0.5rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--orange);margin-bottom:0.3rem;}
.creation-face.back p{color:#fff;font-size:0.62rem;font-weight:600;line-height:1.3;}

.creations-hint{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);color:var(--text-secondary);font-size:0.8rem;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;transition:opacity .4s ease;}

@media (prefers-reduced-motion: reduce){
  .creations-hero{height:auto;}
  .creations-sticky{position:relative;height:auto;padding:3rem 1rem;flex-wrap:wrap;}
  .creations-stage{position:static;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;max-width:600px;margin:0 auto;height:auto;}
  .creation-card{position:static;margin:0;width:auto;height:140px;}
  .creation-card-inner{transition:none;}
  .creations-intro-text,.creations-hint{display:none;}
  .creations-content-text{position:static;opacity:1;transform:none;margin-bottom:2rem;}
}

@media (max-width:767px){
  .creations-hero{height:auto;}
  .creations-sticky{position:relative;height:auto;display:block;padding:2.5rem 1rem 2.5rem;}
  .creations-intro-text,.creations-content-text{position:static;transform:none;opacity:1;width:auto;max-width:none;padding:0;background:none;border:none;box-shadow:none;margin:0 0 1.5rem;text-align:center;}
  .creations-stage{position:static;display:grid;grid-template-columns:repeat(2,1fr);gap:0.9rem;max-width:460px;margin:0 auto;height:auto;}
  .creation-card{position:static;margin:0;width:auto;height:150px;cursor:pointer;}
  .creation-card-inner{transition:transform .6s cubic-bezier(.4,.2,.2,1);}
  .creation-card:hover .creation-card-inner{transform:none;}
  .creation-card.is-flipped .creation-card-inner{transform:rotateY(180deg);}
  .creations-hint{display:none;}
}

/* ---------- Offre Studio créatif : composition à deux colonnes, sans cartes ---------- */
.studio-offer{padding:clamp(2rem,5vw,3.25rem) 0;}
@media(max-width:767px){ .studio-offer{padding-left:1.25rem;padding-right:1.25rem;} }
.studio-offer-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(2rem,5vw,3.5rem);align-items:center;}
@media(max-width:860px){ .studio-offer-grid{grid-template-columns:1fr;} }
.studio-offer-copy .label{display:block;margin-bottom:0.75rem;}
.studio-offer-copy h2{font-size:clamp(1.95rem,4.2vw,2.85rem);margin-bottom:1rem;}
.studio-offer-copy .lead{color:var(--text-secondary);font-size:1.1rem;line-height:1.6;margin-bottom:1.6rem;max-width:480px;}
.studio-offer-line{display:flex;flex-wrap:wrap;align-items:center;gap:0.6rem 0.9rem;margin-top:clamp(1.75rem,4vw,2.5rem);padding-top:1.5rem;border-top:1px solid var(--border);}

/* Mockup multisecteurs (image fournie par le client, fond transparent) */
.studio-offer-visual{width:100%;}
.studio-offer-visual img{display:block;width:100%;height:auto;max-height:460px;object-fit:contain;filter:drop-shadow(0 26px 34px rgba(11,18,32,0.22));transition:transform .5s ease;}
.studio-offer-visual img:hover{transform:rotate(1.4deg);}
/* DA sombre : léger contour neutre pour détacher les structures noires du fond, sans halo coloré */
:root:not([data-theme="light"]) .studio-offer-visual img{filter:drop-shadow(0 0 22px rgba(255,255,255,0.07)) drop-shadow(0 26px 34px rgba(0,0,0,0.45));}

@media (prefers-reduced-motion: reduce){ .studio-offer-visual img{transition:none;} }

@media(max-width:860px){
  .studio-offer-visual img{max-width:560px;max-height:none;margin:0 auto;}
}

/* ---------- Méthode : variante compacte (sans toucher la classe .sol-process-cell partagée) ---------- */
.studio-method-cell{justify-content:flex-start;gap:1.25rem 2.5rem;padding:1.1rem 1.5rem;}
.studio-method-cell .sol-step-sep{width:14px;}

/* ---------- CTA final Studio créatif : bleu nuit dédié (sans toucher .cell.dark partagé) ---------- */
.studio-cta-cell{background:var(--bg-dark);color:#fff;padding:1.85rem 2rem;}
.studio-cta-cell h2{color:#fff;}
.studio-cta-cell p{color:rgba(255,255,255,0.72);}
.studio-cta-cell .btn-primary{background:#fff;color:#0B1220;}
.studio-cta-cell .btn-primary:hover{opacity:.88;}
:root:not([data-theme="light"]) .studio-cta-cell{background:var(--bg-alt);}