/* v18: film chapter. Media stage + picture-in-picture making-of card + calmer text column. */
.world-head{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;margin:0 0 20px}
.world-head .world-num{margin:0}
.world-chips{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.world-chips li{padding:6px 11px;border:1px solid var(--w-line);border-radius:999px;font-size:12px;line-height:1;letter-spacing:.01em;color:var(--w-muted);white-space:nowrap}
.world-outcome{margin:20px 0 0;font-size:clamp(1.35rem,1.7vw,1.6rem);font-weight:600;letter-spacing:-.025em;line-height:1.22;max-width:24ch;color:var(--w-text)}
.world-story{margin:14px 0 0;font-size:16px;line-height:1.5;color:var(--w-muted);max-width:42ch}
.world-why{margin:22px 0 0;padding:1px 0 1px 14px;border-left:2px solid var(--w-accent);font-size:14px;line-height:1.5;color:var(--w-muted);max-width:42ch}
.world-why span{font-weight:500;color:var(--w-text)}
.world-actions{margin-top:30px}
.world-line,.world .world-making{display:none}

/* Making-of card (shared) */
.world-media{position:relative}
.pip-card{--pip-bg:#FDFBF5;--pip-ink:#24241F;--pip-muted:#5C5B53;display:block;padding:8px;border:1px solid rgba(36,36,31,.16);border-radius:6px;background:var(--pip-bg);color:var(--pip-ink);font:inherit;text-align:left;cursor:pointer;box-shadow:0 1px 1px rgba(36,36,31,.08),0 5px 10px rgba(36,36,31,.1),0 20px 34px rgba(36,36,31,.18)}
.pip-card:focus-visible{outline:2px solid var(--w-accent);outline-offset:4px}
.pip-frame{position:relative;display:block;overflow:hidden;border-radius:3px;background:#e8e4d9;aspect-ratio:16/9}
.pip-frame picture,.pip-frame img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pip-video{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none;transition:opacity 250ms var(--ease)}
.pip-video.is-live{opacity:1}
.pip-play{position:absolute;right:8px;bottom:8px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(36,36,31,.78);color:#F7F5EF;z-index:1}
.pip-play svg{width:12px;height:12px;fill:currentColor;margin-left:1px}
.pip-cap{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:9px 2px 2px;font-size:12.5px;line-height:1.2}
.pip-label{font-weight:600;letter-spacing:-.01em;color:var(--pip-ink)}
.pip-dur{font-weight:500;color:var(--pip-muted);font-variant-numeric:tabular-nums}
.pip-go{display:none}
@media (prefers-reduced-motion:reduce){.pip-video{display:none}}

@media (min-width:1001px){
  .world{--world-pad:12vh;--padx:4.15vw;--gap:44px;--tw:clamp(350px,29vw,520px);--C:min(100vw - 2 * var(--padx),1640px);--W:calc(var(--C) - var(--tw) - var(--gap));--pw:max(34%,196px);--tpad:calc(max(var(--W) * .34,196px) * .4 - var(--gap) + 34px)}
  .world-grid{grid-template-columns:minmax(0,1fr) var(--tw);gap:var(--gap);min-height:calc(70vh - 2 * var(--world-pad));max-width:1640px;align-items:center}
  .world--flip .world-grid{grid-template-columns:var(--tw) minmax(0,1fr)}
  .world .world-text{justify-self:stretch;padding-left:var(--tpad)}
  .world--flip .world-text{padding-left:0;padding-right:var(--tpad)}
  .world h2{font-size:clamp(2.2rem,3.2vw,3.8rem)}
  .world .world-play,.world .world-process{flex:1 1 auto;padding:0 18px}
  .pip-card{position:absolute;z-index:3;width:var(--pw);right:calc(var(--pw) * -.4);bottom:-26px;transition:box-shadow 260ms var(--ease)}
  .world--flip .pip-card{right:auto;left:calc(var(--pw) * -.4)}
}
@media (min-width:1100px){
  .world{--padx:112px;padding-left:112px;padding-right:112px}
}
@media (min-width:1001px) and (hover:hover) and (prefers-reduced-motion:no-preference){
  .pip-card{transition:transform 260ms var(--ease),box-shadow 260ms var(--ease)}
  .pip-card:hover,.pip-card:focus-visible{transform:translateY(-5px) scale(1.025);box-shadow:0 2px 2px rgba(36,36,31,.08),0 10px 18px rgba(36,36,31,.12),0 30px 48px rgba(36,36,31,.22)}
}

/* Floating "Start a project" pill steps aside whenever it would sit on a tappable target (script toggles .is-over). */
.float-cta.is-over,.float-cta.is-on.is-over{opacity:0;visibility:hidden;pointer-events:none}