/* Chapter two: motion has an editorial role, with distinct material surfaces. */
.hero-poster,.hero-video{transform:scale(var(--hero-depth,1));transform-origin:50% 30%;will-change:transform}
.hero-copy{opacity:var(--hero-fade,1)}
.motion-ready .statement-word{opacity:var(--word-light,1);transition:opacity .14s linear}
.intro .statement>.statement-word,.intro .statement em .statement-word{color:var(--ink)}
.intro.scene-pinned{padding-block:0;min-height:150svh}
.intro.scene-pinned>.container{position:sticky;top:100px;padding-block:40px 60px}
.intro.scene-pinned .eyebrow{margin-bottom:40px}
.intro.scene-pinned .intro-aside{position:relative}
.intro.scene-pinned .intro-aside::before{content:'';width:48px;height:1px;background:var(--gold);position:absolute;left:0;top:-28px}
.uber-cover{border-radius:var(--cover-radius,0);transition:border-radius .1s linear}
/* The case study is a photographic stage. Incoming images wipe across it. */
.story-photo{clip-path:inset(0 0 100% 0);transform:scale(1.09);transition:clip-path .95s cubic-bezier(.22,1,.36,1),opacity .4s,transform 1.3s cubic-bezier(.22,1,.36,1)}
.story-photo.active{clip-path:inset(0);transform:scale(1)}
.story-glass{color:#fff;background:linear-gradient(115deg,#ffffff30,#ffffff0b);border:1px solid #ffffff70;box-shadow:0 12px 35px #0003,inset 0 1px #ffffff55;backdrop-filter:blur(20px) saturate(1.25);-webkit-backdrop-filter:blur(20px) saturate(1.25);text-shadow:0 1px 8px #0009;border-radius:8px}
.story-frame::after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#0003);pointer-events:none}
.story-glass{z-index:2}
.story-photo-caption{font-size:12px;letter-spacing:.025em}
.story-point{transition:border-color .5s}
.story-chapter:has(.story-point):hover .story-point{border-color:#a5916c}
/* Floating translucent principles over a restrained metallic light field. */
.belief{position:relative;isolation:isolate;overflow:clip;background:#10110f}
.belief::before{content:'';position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 85% 25%,#b49a6a1c,transparent 40%),radial-gradient(ellipse at 15% 85%,#ffffff09,transparent 40%);pointer-events:none}
.belief-list{perspective:1200px;display:grid;gap:25px}
.belief-item,.belief-item:first-child,.belief-item:last-child{padding:38px 24px;min-height:0;gap:18px;border:1px solid #ffffff21;border-radius:12px;background:linear-gradient(125deg,#ffffff0c,#ffffff02);box-shadow:12px 20px 38px #0005,inset 1px 1px 0 #ffffff17,inset -1px -1px 0 #0007;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);overflow:hidden}
.motion-ready .belief-item{transform:translateY(calc((1 - var(--belief-entry,1))*45px)) rotateX(calc((1 - var(--belief-entry,1))*8deg));transform-origin:center bottom;transition:color .5s,border-color .5s,box-shadow .5s}
.belief-item>span{font-size:22px;color:#d1bc95;text-shadow:1px 1px 0 #ffffff20,-1px -1px 2px #000;font-family:var(--serif)}
.belief-item p{font-size:clamp(26px,2.8vw,38px)}
.belief-item.active{border-color:#b49a6a75;box-shadow:14px 25px 50px #0007,inset 1px 1px #ffffff29,inset -1px -1px #0009}
.belief-item::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 20%,#ffffff05 45%,transparent 65%)}
.belief-item::before{top:0;left:24px;width:calc(100% - 48px)}
/* Each project enters as a physical editorial spread, then settles for reading. */
.project-list{perspective:1500px}
.motion-ready .project{transform:translateY(calc((1 - var(--project-entry,1))*60px)) rotateX(calc((1 - var(--project-entry,1))*7deg)) scale(calc(.95 + var(--project-entry,1)*.05));transform-origin:50% 0%;backface-visibility:hidden;box-shadow:0 25px 50px -35px #1113}
.motion-ready .project-image{clip-path:inset(calc((1 - var(--project-entry,1))*14%) calc((1 - var(--project-entry,1))*8%) calc((1 - var(--project-entry,1))*10%) round 2px)}
.project-image img{transition:none;transform:scale(1.08) translateY(var(--image-drift,0px))}
.image-corner{background:#ffffff30;border-top:1px solid #ffffff85;border-left:1px solid #ffffff85;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);box-shadow:inset 1px 1px 0 #ffffff4d}
.metrics>div>span{display:inline-block;text-shadow:1px 2px 0 #fff,3px 5px 8px #11111112}
.services-orbit{box-shadow:inset 1px 0 #dfca9b24,1px 0 10px #b49a6a12}
.site-header.scrolled{background:linear-gradient(110deg,#131411d9,#11120fe8);border-bottom:1px solid #ffffff19;box-shadow:0 8px 25px #00000014;backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3)}
/* A short mobile stage, never full-screen pinning of the reading area. */
@media(max-width:899px) and (min-height:700px){
  .motion-ready .story-layout{position:relative;isolation:isolate}
  .motion-ready .story-visual{display:block;position:sticky;top:68px;z-index:4;padding:12px 0 16px;margin:0 -4px 30px;background:linear-gradient(var(--paper) 88%,#f8f7f300)}
  .motion-ready .story-frame{position:relative;height:29svh;min-height:210px;max-height:320px;overflow:hidden;border-radius:3px;box-shadow:0 15px 30px -22px #1118}
  .motion-ready .story-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 45%;opacity:0}
  .motion-ready .story-photo.active{opacity:1}
  .motion-ready .story-glass{position:absolute;bottom:13px;left:13px;right:13px;display:flex;justify-content:space-between;padding:12px;font-size:9px;letter-spacing:.06em}
  .motion-ready .story-track{height:1px;background:var(--line);margin-top:15px}
  .motion-ready .story-track span{display:block;background:var(--gold);height:1px;transform:scaleX(var(--story-progress,.01));transform-origin:left}
  .motion-ready .story-photo-caption{margin-top:8px;font-size:10px;color:#686b60}
  .motion-ready .story-mobile-image{display:none}
  .motion-ready .story-chapter{padding:20px 0 60px;min-height:72svh;scroll-margin-top:calc(29svh + 160px)}
  .motion-ready .story-point{padding-block:30px}
}
@media(min-width:900px){.belief-item,.belief-item:first-child,.belief-item:last-child{padding:45px 35px;min-height:240px}.belief-item::before{left:35px;width:calc(100% - 70px)}.belief-list{gap:35px;padding-bottom:20px}.story-frame{border-radius:5px;box-shadow:0 24px 45px -30px #1116}.story-glass{padding:22px 24px}}
@media(prefers-reduced-motion:reduce){
  .intro.scene-pinned{min-height:0;padding-block:90px}.intro.scene-pinned>.container{position:static;padding:0}
  .hero-poster,.hero-video,.project,.belief-item,.project-image,.project-image img{transform:none!important;clip-path:none!important}
  .hero-copy,.statement-word{opacity:1!important}.story-photo{clip-path:none!important}
}
/* Let each Uber point follow the preceding one at reading pace. The photo
   remains sticky, while its counter follows the visible point. */
.story-chapter{padding-bottom:24px}
.story-point.is-current .point-number{color:#7c6338;font-weight:700}
@media(min-width:900px){
  .story-chapter{display:block;min-height:0;padding:0 0 24px}
  .story-point{padding:24px 0}
}
@media(max-width:899px) and (min-height:700px){
  .motion-ready .story-chapter{min-height:0;padding:12px 0 24px;scroll-margin-top:calc(29svh + 125px)}
}