.page-hero--story{background:#15110f}.story-feature{display:grid;grid-template-columns:.65fr 1.35fr;gap:25px;align-items:center}.story-feature-logo{width:min(80%,520px);height:auto;justify-self:center}.story-feature video{min-height:520px;background:#050505}.case-study--orange .micro{color:#111}.supporting-section--story{background:#e5ded2}
/* Storytelling refinements */
.story-feature--main{grid-template-columns:.45fr 1.55fr;align-items:center;margin-top:10px}.story-main-video{position:relative;min-width:0}.story-main-video video{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:#050505}.story-main-video figcaption,.story-short-video figcaption{margin-top:8px;font-size:9px;text-transform:uppercase;letter-spacing:.13em;opacity:.6}.story-short-video{margin:30px 0 0 auto;width:min(310px,32vw)}.story-short-video video{width:100%;height:auto;max-height:540px;object-fit:contain;background:#050505}.support-card--audio{display:flex;flex-direction:column;min-height:100%}.support-card--audio audio{margin-top:auto;padding-top:24px}

/* Softer orange and clearer secondary media */
.case-study--orange{background:#c9784f;color:#15120f}
.case-study--orange .case-number{color:#15120f}
.story-short-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,310px);gap:28px;align-items:end;margin-top:30px}
.story-short-note{align-self:center;max-width:520px;padding:28px;border-top:1px solid rgba(255,255,255,.22)}
.story-short-note p{margin-top:12px;font-size:13px;line-height:1.6;opacity:.72}
.story-short-row .story-short-video{margin:0;width:100%}
.support-media--battle{height:260px}
.support-media--battle img{object-fit:cover;object-position:center}

/* V8 — richer orange, still inside the existing palette. */
.case-study--orange{background:#d66a36;color:#15120f}
.case-study--orange .case-number,.case-study--orange .micro{color:#15120f}

/* V12 — align La Bataille des ombres with the neighbouring support card. */
.support-card--battle .support-media--battle{height:280px}
.support-card--battle .support-media--battle img{width:100%;height:100%;object-fit:contain;object-position:center;background:#111}


/* V16 — preserve the full frame of project videos without changing case-study content. */
.story-feature--main video{min-height:0;height:auto;object-fit:contain}


.supporting-section--story .support-media--landscape{height:auto;min-height:0;aspect-ratio:auto}
.supporting-section--story .support-media--landscape video{width:100%;height:auto;object-fit:contain}


/* V17 — PromoTIM: version principale dominante, version courte secondaire, ratios naturels. */
.case-split--story{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(220px,.65fr);gap:20px;align-items:start}
.case-split--story .case-media{width:100%;height:auto;min-height:0;aspect-ratio:auto;background:transparent}
.case-split--story .case-media:nth-child(2){width:min(100%,390px);justify-self:end}
.case-split--story video{display:block;width:100%;height:auto;min-height:0;aspect-ratio:auto;object-fit:contain;background:#111}
@media (max-width:900px){.case-split--story{grid-template-columns:1fr}.case-split--story .case-media:nth-child(2){width:min(100%,360px);justify-self:start}}


/* Final requested alignment: short PromoTIM version sits visually centered in its column. */
@media(min-width:901px){.case-split--story .case-media:nth-child(2){margin-top:72px}}


/* 2026-09-03 — la section Promo TIM passe du orange au noir. */
.case-study--orange{background:#11100f;color:#fff}
.case-study--orange .case-number{color:var(--orange)}
.case-study--orange .micro{color:rgba(255,255,255,.72)}
.case-study--orange .case-context-grid>div{background:rgba(255,255,255,.055)}