/* Page Le studio */
.st-hero { position:relative; min-height:100vh; min-height:100svh; display:grid; grid-template-columns:minmax(0, 1.05fr) minmax(0, 1fr); gap:clamp(24px, 4vw, 64px); align-items:center; padding:calc(var(--nav-h) + 40px) var(--g) 56px; overflow:hidden; overflow:clip; }
.st-hero-text { position:relative; z-index:2; }
.st-eyebrow { display:flex; align-items:center; gap:14px; color:rgba(242,238,230,.75); }
.st-flag { display:inline-flex; width:30px; height:4px; }
.st-flag i { flex:1; } .st-flag i:nth-child(1) { background:#2a4fa3; } .st-flag i:nth-child(2) { background:var(--paper); } .st-flag i:nth-child(3) { background:#e0412b; }
.st-hero h1 { margin:24px 0 0; font-family:"Instrument Serif",serif; font-weight:400; font-size:clamp(64px, 9.4vw, 164px); line-height:.86; letter-spacing:-.03em; }
.st-hero h1 span { display:block; overflow:hidden; overflow:clip; padding-bottom:.06em; }
.st-hero h1 span > b { display:block; font-weight:400; animation:st-line 1.2s cubic-bezier(.16,1,.3,1) both; }
.st-hero h1 span:nth-child(2) > b { animation-delay:.12s; } .st-hero h1 span:nth-child(3) > b { animation-delay:.24s; }
.st-hero h1 em { color:var(--verm); }
@keyframes st-line { from { transform:translateY(105%); } to { transform:none; } }
.st-hero-text > p { margin:30px 0 0; max-width:520px; font-size:18px; line-height:1.65; color:#d7d2c8; animation:st-fade 1s cubic-bezier(.16,1,.3,1) .5s both; }
.st-hero .btn-row { margin-top:34px; animation:st-fade 1s cubic-bezier(.16,1,.3,1) .65s both; }
@keyframes st-fade { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:none; } }
.st-facts { display:flex; flex-wrap:wrap; gap:10px; margin-top:40px; animation:st-fade 1s cubic-bezier(.16,1,.3,1) .8s both; }
.st-facts span { padding:9px 14px; border:1px solid rgba(242,238,230,.25); border-radius:99px; background:rgba(17,16,22,.72); }
.st-wall { position:relative; align-self:stretch; display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; height:calc(100svh - var(--nav-h) - 96px); min-height:520px; -webkit-mask:linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%); mask:linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%); }
.st-col { display:flex; flex-direction:column; gap:14px; animation:st-scroll 46s linear infinite; }
.st-col:nth-child(2) { animation-duration:58s; animation-direction:reverse; margin-top:-120px; }
.st-col:nth-child(3) { animation-duration:52s; margin-top:-60px; }
@keyframes st-scroll { to { transform:translateY(-50%); } }
.st-col img { display:block; width:100%; aspect-ratio:3 / 4; object-fit:cover; border-radius:6px; border:1px solid rgba(216,178,90,.22); box-shadow:0 20px 50px rgba(0,0,0,.45); }
.st-col img.phone { aspect-ratio:390 / 844; object-position:top; border:5px solid #1b1a20; border-radius:18px; }
.st-col img.wide { aspect-ratio:1 / 1; }
.st-wall:hover .st-col { animation-play-state:paused; }

/* section 2 : passionnés */
.st-passion { background:var(--paper); color:var(--ink); padding:clamp(96px, 12vw, 160px) var(--g); }
.st-passion .mono { color:#77736c; }
.st-head { display:grid; grid-template-columns:minmax(0, 1.2fr) minmax(0, 1fr); gap:32px 80px; align-items:end; margin-bottom:clamp(64px, 8vw, 110px); }
.st-head h2 { margin:18px 0 0; font-family:"Instrument Serif",serif; font-weight:400; font-size:clamp(48px, 6.6vw, 104px); line-height:.9; letter-spacing:-.02em; }
.st-head h2 em { color:var(--verm); }
.st-head p { margin:0; max-width:520px; font-size:18px; line-height:1.65; color:#4a4744; }
.st-row { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.1fr); gap:clamp(32px, 6vw, 96px); align-items:center; padding:clamp(48px, 6vw, 80px) 0; border-top:1px solid rgba(17,16,22,.15); }
.st-row:nth-child(even) .st-visual { order:-1; }
.st-num { font-family:"Cinzel",serif; font-weight:700; font-size:clamp(56px, 6vw, 96px); line-height:1; background:linear-gradient(180deg, #c89a3c, #8c6a2a); -webkit-background-clip:text; background-clip:text; color:transparent; }
.st-row h3 { margin:14px 0 16px; font-family:"Instrument Serif",serif; font-weight:400; font-size:clamp(38px, 4vw, 60px); line-height:.98; letter-spacing:-.015em; }
.st-row p { margin:0; max-width:520px; font-size:17px; line-height:1.7; color:#4a4744; }
.st-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.st-tags span { padding:7px 12px; border:1px solid rgba(17,16,22,.25); border-radius:99px; font-family:"JetBrains Mono",monospace; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:#4a4744; }
.st-visual { position:relative; min-height:clamp(320px, 34vw, 480px); border-radius:6px; overflow:hidden; background:var(--ink); box-shadow:0 40px 90px rgba(17,16,22,.25); isolation:isolate; }
.st-visual > img.bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.4s cubic-bezier(.16,1,.3,1); }
.st-visual:hover > img.bg { transform:scale(1.06); }
.st-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(17,16,22,0) 40%, rgba(17,16,22,.65) 100%); pointer-events:none; }
.st-visual .phones { position:absolute; right:8%; bottom:-12%; z-index:1; display:flex; gap:14px; }
.st-visual .phones img { width:clamp(90px, 10vw, 150px); aspect-ratio:390 / 844; object-fit:cover; object-position:top; border:5px solid #1b1a20; border-radius:18px; box-shadow:0 30px 60px rgba(0,0,0,.6); }
.st-visual .phones img:first-child { transform:translateY(-30px) rotate(-5deg); }
.st-visual .phones img:last-child { transform:rotate(4deg); }
.st-visual .orders { position:absolute; inset:0; z-index:1; display:flex; justify-content:center; align-items:center; gap:clamp(12px, 3vw, 40px); background:radial-gradient(60% 60% at 50% 50%, rgba(216,178,90,.18), transparent 70%); }
.st-visual .orders img { width:clamp(70px, 9vw, 130px); filter:drop-shadow(0 20px 30px rgba(0,0,0,.7)); animation:st-bob 5s ease-in-out infinite; }
.st-visual .orders img:nth-child(2) { animation-delay:-1.6s; } .st-visual .orders img:nth-child(3) { animation-delay:-3.2s; }
@keyframes st-bob { 50% { transform:translateY(-12px); } }
.st-visual .orders span { position:absolute; left:24px; bottom:20px; z-index:2; color:var(--gold); }
.st-split { position:absolute; inset:0; }
.st-split img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.st-split img:last-child { clip-path:polygon(58% 0, 100% 0, 100% 100%, 42% 100%); transition:clip-path 1s cubic-bezier(.16,1,.3,1); }
.st-visual:hover .st-split img:last-child { clip-path:polygon(48% 0, 100% 0, 100% 100%, 32% 100%); }
.st-split::after { content:""; position:absolute; top:-10%; bottom:-10%; left:50%; width:3px; background:var(--verm); transform:rotate(12.5deg); box-shadow:0 0 24px rgba(255,75,31,.7); }
.st-visual .labels { position:absolute; left:24px; right:24px; bottom:20px; z-index:2; display:flex; justify-content:space-between; color:var(--paper); }

/* section 3 : l'impossible */
.st-impossible { position:relative; padding:clamp(96px, 12vw, 170px) var(--g); background:radial-gradient(70% 50% at 50% 0%, #1f1a1d 0%, var(--ink) 70%); overflow:hidden; overflow:clip; }
.st-word { margin:0; font-family:"Instrument Serif",serif; font-weight:400; font-size:clamp(76px, 16.5vw, 290px); line-height:.8; letter-spacing:-.04em; white-space:nowrap; color:var(--paper); }
.st-im { position:relative; display:inline-block; color:var(--verm); }
.st-im::after { content:""; position:absolute; left:-4%; right:-4%; top:50%; height:.07em; background:var(--paper); box-shadow:0 0 30px rgba(242,238,230,.35); transform:translateY(-50%); }
@supports (animation-timeline: view()) {
  .st-im { animation:st-fade-im linear both; animation-timeline:view(); animation-range:entry 30% cover 50%; }
  .st-im::after { animation:st-strike linear both; animation-timeline:view(); animation-range:entry 30% cover 50%; transform-origin:left center; }
}
@keyframes st-strike { from { transform:translateY(-50%) scaleX(0); } to { transform:translateY(-50%) scaleX(1); } }
@keyframes st-fade-im { from { color:var(--verm); } to { color:rgba(255,75,31,.32); } }
.st-imp-head { display:grid; grid-template-columns:minmax(0, 1.2fr) minmax(0, 1fr); gap:32px 80px; align-items:end; margin-top:clamp(40px, 5vw, 72px); }
.st-imp-head h2 { margin:0; font-family:"Instrument Serif",serif; font-weight:400; font-size:clamp(40px, 5.2vw, 84px); line-height:.94; letter-spacing:-.02em; }
.st-imp-head h2 em { color:var(--verm); }
.st-imp-head p { margin:0; max-width:520px; font-size:18px; line-height:1.65; color:#c9c5bd; }
.st-feats { margin:clamp(56px, 7vw, 96px) 0 0; padding:0; list-style:none; border-top:1px solid var(--line); }
.st-feat { position:relative; display:grid; grid-template-columns:150px minmax(0, 1fr) auto; gap:16px 40px; align-items:center; padding:30px 0; border-bottom:1px solid var(--line); transition:background .4s ease, padding .5s cubic-bezier(.16,1,.3,1); }
.st-feat:hover { background:linear-gradient(90deg, rgba(255,75,31,.08), transparent 70%); padding-left:20px; }
.st-feat .was { position:relative; justify-self:start; color:var(--mute); }
.st-feat .was::after { content:""; position:absolute; left:-4px; right:-4px; top:50%; height:1.5px; background:var(--verm); }
.st-feat strong { font-family:"Instrument Serif",serif; font-weight:400; font-size:clamp(24px, 2.6vw, 38px); line-height:1.1; color:var(--paper); }
.st-feat .done { display:flex; flex-direction:column; align-items:flex-end; gap:6px; text-align:right; }
.st-feat .done b { font-family:"Cinzel",serif; font-weight:700; font-size:14px; letter-spacing:.14em; color:var(--gold); }
.st-feat .done span { color:#c9c5bd; font-size:14px; }
.st-cta { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:28px; margin-top:clamp(72px, 9vw, 120px); padding:clamp(32px, 4vw, 56px); border:1px solid rgba(216,178,90,.35); border-radius:6px; background:linear-gradient(120deg, rgba(255,75,31,.12), rgba(216,178,90,.06)); }
.st-cta h3 { margin:0; font-family:"Instrument Serif",serif; font-weight:400; font-size:clamp(34px, 3.6vw, 56px); line-height:1; }
.st-cta h3 em { color:var(--verm); }
.st-cta p { margin:12px 0 0; color:#c9c5bd; font-size:16.5px; }

@media (max-width:1100px) {
  .st-hero { grid-template-columns:1fr; }
  .st-wall { position:absolute; inset:0; height:auto; min-height:0; opacity:.22; grid-template-columns:repeat(3, 1fr); padding:0 var(--g); pointer-events:none; }
  .st-head, .st-imp-head { grid-template-columns:1fr; }
}
@media (max-width:820px) {
  .st-row { grid-template-columns:1fr; }
  .st-row:nth-child(even) .st-visual { order:0; }
  .st-feat { grid-template-columns:1fr; gap:10px; }
  .st-feat .done { align-items:flex-start; text-align:left; }
  .st-feat:hover { padding-left:0; }
  .st-visual .phones { right:6%; bottom:-18%; }
}
@media (prefers-reduced-motion: reduce) {
  .st-col, .st-visual .orders img, .st-im, .st-im::after { animation:none !important; }
}