/* Shared navigation and reading hierarchy; original case media stays intact. */
.case-header,.ll-page .ll-site-header{position:sticky;top:0;background:#ffffffed;backdrop-filter:blur(12px);z-index:100;height:76px}.case-header nav,.ll-page .case-nav{height:100%;padding:0 40px;display:flex;align-items:center;justify-content:space-between;font-size:16px;font-weight:400;text-transform:none;letter-spacing:0;max-width:none}.case-header nav>div,.ll-page .case-nav>div{display:flex;gap:32px}.case-wordmark{font-weight:700;letter-spacing:-.03em}.ll-page{--ll-nav-h:76px}.ll-page .ll-rail-label{font-size:12px!important;margin-bottom:22px;color:#888}.ll-page .ll-rail a{padding:8px 0;font-size:14px;line-height:1.5;color:#777;font-weight:400}.ll-page .ll-rail a[aria-current="location"]{font-weight:600;color:#111}.ll-page .ll-rail a::before{content:none}.ll-page .ll-hero-side>p+p{margin-top:18px}.ll-page .ll-hero h1{max-width:17ch}.fb-page{font-family:Geist,Arial,Helvetica,sans-serif;background:white;color:#171717;margin:0;-webkit-font-smoothing:antialiased}.fb-page *{box-sizing:border-box}.fb-page h1,.fb-page h2,.fb-page p,.fb-page ol{margin:0}.fb-page a{color:inherit;text-decoration:none}.fb-page button,.fb-page select{font:inherit}.fb-page img{display:block;max-width:100%;height:auto}.fb-page a:focus-visible,.fb-page button:focus-visible,.fb-page select:focus-visible{outline:2px solid #567f98;outline-offset:5px}.case-skip{position:fixed;top:-80px;left:20px;background:#fff;z-index:120;padding:10px}.case-skip:focus{top:10px}.case-sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.fb-intro{width:min(1320px,calc(100% - 96px));margin:54px auto 100px}.fb-project-label{display:flex;justify-content:space-between;font-size:14px;font-weight:600}.fb-project-label span:first-child{text-transform:uppercase;font-size:20px;font-weight:700}.fb-intro-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:80px;align-items:start;margin-top:70px}.fb-intro h1{font-size:clamp(36px,4vw,62px);line-height:1.08;font-weight:600;letter-spacing:-.04em}.fb-intro p{font-size:17px;line-height:1.65;color:#555;margin-bottom:20px}.fb-intro .fb-scope{font-size:12px;color:#777;border-top:1px solid #e5e5e5;padding-top:20px;margin-top:28px}.fb-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:64px;margin:0 40px 120px}.fb-rail{position:sticky;top:124px;align-self:start}.fb-rail>p{font-size:12px;color:#888;margin-bottom:22px}.fb-rail ol{padding:0;list-style:none}.fb-rail a{display:block;padding:8px 0;font-size:14px;line-height:1.5;color:#777}.fb-rail a[aria-current="location"]{font-weight:600;color:#111}.fb-rail select{display:none}.fb-story{min-width:0;max-width:1440px}.fb-chapter{scroll-margin-top:110px;margin-bottom:100px}.fb-chapter:last-child{margin-bottom:0}.fb-chapter:focus{outline:none}.fb-chapter h2{font-size:26px;font-weight:500;letter-spacing:-.02em;margin-bottom:26px}.fb-chapter-media{display:flex;flex-direction:column;gap:32px}.fb-board{width:100%;height:auto;border-radius:12px;overflow:hidden}.fb-video{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:12px;background:#f3f3f3}.fb-video .vimeo-lazy,.fb-video iframe,.fb-video .vimeo-lazy__poster{position:absolute;inset:0;width:100%;height:100%;border:0}.fb-video .vimeo-lazy__poster{object-fit:cover;z-index:1}.fb-video .vimeo-lazy__play{position:absolute;inset:0;z-index:3;background:#00000012;cursor:pointer;border:0;display:grid;place-items:center}.fb-video .vimeo-lazy__play-icon{display:grid;place-items:center;background:#fff;border-radius:50%;width:60px;height:60px;box-shadow:0 4px 25px #0002}.fb-video .vimeo-lazy__play-icon::after{content:'▶';font-size:20px;color:#111;margin-left:3px}.fb-video .vimeo-lazy__play.is-gone{display:none}.fb-motion-note{max-width:650px;font-size:16px;line-height:1.6;color:#666}.case-footer{padding:54px 40px 32px;border-top:1px solid #ddd}.case-footer>div{display:flex;flex-direction:column;gap:16px}.case-footer span{color:#777;font-size:13px}.case-footer>div>a{font-size:42px;letter-spacing:-.03em}.case-footer>nav{display:flex;gap:24px;margin-top:60px;font-size:13px;color:#666}
@media(min-width:1180px){.ll-page .ll-rail{transform:translateX(calc(-1 * clamp(0px,(100vw - 1320px)/2 - 16px,324px)))}}
@media(max-width:1179px){.fb-layout{display:block;margin-inline:32px}.fb-rail{top:76px;z-index:50;background:#ffffffed;backdrop-filter:blur(10px);padding:8px 0;margin-bottom:32px}.fb-rail ol,.fb-rail>p{display:none}.fb-rail select{display:block;width:100%;border:0;background:transparent;height:40px;font-size:14px;color:#222}.fb-chapter{scroll-margin-top:152px}.fb-intro-grid{gap:40px}.fb-intro{margin-bottom:64px}.fb-chapter{margin-bottom:80px}}
@media(max-width:640px){.case-header,.ll-page .ll-site-header{height:66px}.ll-page{--ll-nav-h:66px}.case-header nav,.ll-page .case-nav{padding:0 24px;font-size:14px}.case-header nav>div,.ll-page .case-nav>div{gap:24px}.fb-intro{width:calc(100% - 40px);margin-top:40px;margin-bottom:48px}.fb-intro-grid{grid-template-columns:1fr;margin-top:36px;gap:28px}.fb-intro h1{font-size:38px}.fb-intro p{font-size:16px}.fb-layout{margin-inline:16px;margin-bottom:64px}.fb-rail{top:66px}.fb-chapter-media{gap:24px}.fb-chapter h2{font-size:23px;margin-bottom:20px}.fb-chapter{margin-bottom:64px;scroll-margin-top:138px}.fb-board,.fb-video{border-radius:8px}.case-footer{padding:40px 24px 28px}.case-footer>div>a{font-size:34px}.case-footer>nav{flex-wrap:wrap;gap:20px}.fb-video .vimeo-lazy__play-icon{width:44px;height:44px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.fb-page *{animation:none!important;transition:none!important}}
.fb-video .vimeo-lazy__play-icon::after{border:0;margin:0 0 0 3px;line-height:1}.fb-video .vimeo-lazy__play:hover .vimeo-lazy__play-icon{background:#eee}.fb-board-open{display:block;position:relative;border-radius:12px}.fb-board-open>span{position:absolute;bottom:10px;right:12px;font-size:12px;background:#fffffff0;color:#444;border-radius:20px;padding:7px 10px;opacity:0;transition:opacity .2s}.fb-board-open:hover>span,.fb-board-open:focus-visible>span{opacity:1}.fb-board-dialog{width:calc(100% - 40px);max-width:1500px;height:calc(100dvh - 60px);max-height:none;border:0;padding:0;border-radius:12px;background:#f5f5f4;color:#111}.fb-board-dialog::backdrop{background:#000b;backdrop-filter:blur(10px)}.fb-board-toolbar{height:60px;display:flex;gap:16px;align-items:center;justify-content:flex-end;padding:12px 20px;border-bottom:1px solid #ddd;background:white}.fb-board-toolbar button{border:1px solid #ccc;background:white;border-radius:22px;padding:8px 14px;cursor:pointer}.fb-board-canvas{height:calc(100% - 60px);overflow:auto;display:grid;place-items:center;overscroll-behavior:contain}.fb-board-canvas img{width:100%;height:100%;object-fit:contain;max-height:100%}.fb-board-canvas.is-zoomed{display:block}.fb-board-canvas.is-zoomed img{width:max(100%,1300px);max-width:none;height:auto;max-height:none;object-fit:initial}.fb-page.has-board-open{overflow:hidden}
@media(max-width:640px){.fb-board-open>span{opacity:1;font-size:10px;bottom:4px;right:4px;padding:4px 7px}.fb-board-dialog{width:calc(100% - 20px);height:calc(100dvh - 30px)}.fb-board-toolbar{height:54px}.fb-board-canvas{height:calc(100% - 54px)}}

/* Field Brief: the same centred column, rail position and intro type as the LiveLarge case study. */
.fb-page { --c-rail: 180px; --c-gap: clamp(40px, 3vw, 72px); --c-edge: var(--pf-edge, 40px);
  --t-label: clamp(13px, .66vw, 14px); --t-body: clamp(16px, .8vw, 17px); --t-display: clamp(28px, 1.9vw, 40px); }
.pf-selected-case.fb-page .fb-project-label span { font-size: var(--t-label) !important; font-weight: 500; letter-spacing: normal; text-transform: none; color: #86868b; }
.pf-selected-case.fb-page .pf-case-intro .pf-case-title { font-size: var(--t-display) !important; font-weight: 600 !important; letter-spacing: -.025em; color: #1d1d1f; }
.pf-selected-case.fb-page .pf-case-copy > p { font: 400 var(--t-body)/1.6 Geist, Arial, sans-serif !important; color: #424245; max-width: none; }
.pf-selected-case.fb-page .pf-case-copy > p.fb-scope { font-size: var(--t-label) !important; color: #86868b; }
@media (min-width: 1400px) {
  .fb-page { --c-content: min(1360px, calc(100vw - 2 * (var(--c-edge) + var(--c-rail) + var(--c-gap)) - 16px)); }
  .pf-selected-case.fb-page .fb-intro.pf-case-intro { width: var(--c-content); margin-left: auto; margin-right: auto; }
  .fb-page .fb-layout { grid-template-columns: var(--c-rail) minmax(0, 1fr) var(--c-rail); column-gap: var(--c-gap); margin: 0 0 120px; padding: 0 var(--c-edge); }
  .fb-page .fb-story { width: var(--c-content); max-width: none; justify-self: center; }
}

/* Contents rail (every case study with chapters): a light track and one grey marker, one text line tall.
   js/portfolio-rail.js moves the marker to the current chapter; it glides there with the text colour on the same timing. */
.ll-rail ol, .fb-rail ol { --rail-pad: 8px; --rail-ease: cubic-bezier(.22, 1, .36, 1); position: relative; padding-left: 18px; }
.ll-rail a, .fb-rail a { padding-block: var(--rail-pad) !important; }
.ll-rail ol::before, .fb-rail ol::before { content: ""; position: absolute; left: 0; top: var(--rail-pad); bottom: var(--rail-pad); width: 2px;
  background: linear-gradient(90deg, transparent 25%, #e5e5e5 25% 75%, transparent 75%); }
.ll-rail ol::after, .fb-rail ol::after { content: ""; position: absolute; left: 0; top: 0; width: 2px; height: var(--rail-h, 0px);
  transform: translateY(var(--rail-y, 0px)); border-radius: 1px; background: #86868b; opacity: var(--rail-on, 0); }
.ll-rail ol.rail-ready::after, .fb-rail ol.rail-ready::after { transition: transform .45s var(--rail-ease), height .45s var(--rail-ease), opacity .2s ease; }
.ll-rail a, .fb-rail a { color: #86868b !important; font-weight: 400 !important; transition: color .45s var(--rail-ease); }
.ll-rail a::before, .fb-rail a::before { content: none !important; }
.ll-rail a:hover, .fb-rail a:hover, .ll-rail a[aria-current="location"], .fb-rail a[aria-current="location"] { color: #1d1d1f !important; }
@media (prefers-reduced-motion: reduce) { .ll-rail ol.rail-ready::after, .fb-rail ol.rail-ready::after, .ll-rail a, .fb-rail a { transition: none; } }
