body .bf-case.storyboard-panel{background:#f1eee5 url('/assets/befreed/case-background.jpg') center center/cover no-repeat!important}
.bf-case .story-toolbar{position:relative;background:transparent!important;border:0!important}
.bf-case .story-scroll,.bf-document{background:transparent!important}
.bf-document{max-width:1320px;margin:auto;padding:24px 48px 0;color:#623521}
.bf-title{margin:8px 0 32px}
body .bf-title p{font-size:14px!important;color:#746f69!important;margin:0 0 10px}
body .bf-title h1{font-family:'Hepta Slab',Georgia,serif;font-size:clamp(28px,3vw,44px)!important;font-weight:400;line-height:1.25;letter-spacing:-.04em;color:#623521;margin:0}
.bf-film{margin:0;border-radius:18px;overflow:hidden;background:#111;box-shadow:0 18px 55px #493c2518}
.bf-video-wrap{position:relative;line-height:0}.bf-film video{display:block;width:100%;height:auto;aspect-ratio:1972/1080;background:#111}
.bf-controls{display:flex;align-items:center;gap:14px;padding:18px 24px;background:#111}
.bf-controls[hidden],.bf-big-play[hidden]{display:none!important}
.bf-controls button,.bf-big-play{display:flex;align-items:center;justify-content:center;border:0;border-radius:50%;width:46px;height:46px;flex-shrink:0;background:#f7f7f5;color:#171720!important;padding:12px;cursor:pointer}
.bf-controls svg,.bf-big-play svg{width:100%;height:100%}
.bf-big-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:82px;height:82px;padding:25px;background:#f7f7f5ef;box-shadow:0 4px 30px #0004}
.bf-seek{flex:1;min-width:0;accent-color:#fff;cursor:pointer;height:24px}.bf-time{font-size:12px!important;color:#eee!important;font-variant-numeric:tabular-nums;white-space:nowrap}.bf-sound[aria-pressed="true"] .bf-waves{opacity:.25}
.bf-controls .bf-fullscreen{background:transparent;color:#fff!important;width:36px;padding:7px}
.bf-player-status:empty{display:none}.bf-player-status{color:white!important;padding:0 24px 16px;font-size:14px!important}
.bf-description{max-width:820px;margin:64px auto 80px}
body .bf-description p{font-size:18px!important;line-height:1.75!important;color:#625c55!important;margin:0 0 22px}
body .bf-description .bf-lead{font-size:25px!important;line-height:1.4!important;color:#623521!important;margin-bottom:24px}
.bf-meta{display:grid;grid-template-columns:1fr 1fr;gap:24px;border-top:1px solid #62352126;padding-top:24px;margin:32px 0}.bf-meta dt{font-size:13px;color:#746f69!important;margin-bottom:7px}.bf-meta dd{font-size:15px;line-height:1.5;margin:0}
body .bf-link{color:#E11B0C!important;text-decoration:underline;text-underline-offset:6px}
.bf-document .story-footer{background:transparent!important;border-top:1px solid #62352126;padding:28px 0 40px;display:flex;justify-content:space-between;gap:22px}
.bf-case :is(button,a,input):focus-visible{outline:2px solid #E11B0C;outline-offset:4px}
.bf-film:fullscreen{display:flex;flex-direction:column;justify-content:center;background:#111}.bf-film:fullscreen video{max-height:calc(100dvh - 86px);object-fit:contain}.bf-film:fullscreen .bf-controls{flex-shrink:0}
@media(max-width:650px){.bf-document{padding:18px 18px 0}.bf-title{margin:6px 0 24px}.bf-case .story-toolbar{padding:0 16px!important}.bf-film{border-radius:12px}.bf-controls{padding:12px;gap:8px}.bf-controls button{width:38px;height:38px;padding:10px}.bf-controls .bf-fullscreen{width:30px;padding:6px}.bf-time{font-size:10px!important}.bf-big-play{width:58px;height:58px;padding:18px}.bf-description{margin:36px auto 46px}body .bf-description p{font-size:16px!important}.bf-meta{grid-template-columns:1fr}.bf-document .story-footer{font-size:13px}}
body .bf-title :is(h1,p){text-transform:none!important;text-align:left!important}
body .bf-controls svg,body .bf-big-play svg{color:#171720!important}
body .bf-controls .bf-fullscreen svg{color:#fff!important}
/* Match the case-study type scale and keep controls inside the picture. */
body .bf-case.storyboard-panel{background-image:url('/assets/befreed/case-background-v2.jpg')!important}
.bf-document{max-width:1096px;padding-top:32px}
.bf-title{margin:0 0 32px}
body .bf-title h1{font-family:'Hepta Slab',serif!important;font-size:40px!important;line-height:1.18!important;font-weight:400!important;letter-spacing:-.045em!important;margin:0 0 24px!important}
body .bf-title p{font-size:14px!important;line-height:1.6!important;font-weight:400!important;color:#64615f!important}
body .bf-description p{font-size:16px!important;line-height:1.6!important;color:#64615f!important}
body .bf-description .bf-lead{font-family:'Hepta Slab',serif!important;font-size:32px!important;line-height:1.18!important;letter-spacing:-.045em!important;font-weight:400!important;color:#623521!important}
.bf-film{position:relative}
.bf-controls{position:absolute;bottom:0;left:0;right:0;z-index:2;padding:32px 18px 14px;background:linear-gradient(transparent,rgba(0,0,0,.78));opacity:0;pointer-events:none;transition:opacity .18s ease}
.bf-big-play{opacity:0;pointer-events:none;transition:opacity .18s ease}
.bf-film:hover .bf-controls,.bf-film:has(:focus-visible) .bf-controls,.bf-film:hover .bf-big-play,.bf-film:has(:focus-visible) .bf-big-play{opacity:1;pointer-events:auto}
.bf-film:fullscreen video{max-height:100dvh}
.bf-player-status:not(:empty){position:absolute;top:0;left:0;right:0;background:#111d}
@media(max-width:800px){body .bf-title h1{font-size:32px!important}}
@media(max-width:650px){.bf-document{padding-top:20px}.bf-controls{padding:24px 10px 10px}.bf-description{margin-top:36px}body .bf-description .bf-lead{font-size:28px!important}}
@media(hover:none){.bf-controls,.bf-big-play{opacity:1;pointer-events:auto}}
@media(prefers-reduced-motion:reduce){.bf-controls,.bf-big-play{transition:none}}
body .project-dialog .bf-case .bf-description .bf-lead{font-family:var(--portfolio-body,Arial,sans-serif)!important;font-size:18px!important;line-height:1.6!important;letter-spacing:0!important;font-weight:400!important;color:#64615f!important}
/* Design DNA: measured Amtrak colors and computed opening typography. */
.bf-case{--bf-heading-ink:#623521;--bf-label-ink:#736a65;--bf-heading-size:40px;--bf-label-title-gap:28px}
.bf-opening{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin:24px 0 40px}
.bf-title{max-width:660px;margin:0}
body .project-dialog .bf-case .bf-title h1{font-family:'Hepta Slab',serif!important;font-size:var(--bf-heading-size)!important;line-height:1.18!important;font-weight:400!important;letter-spacing:-.045em!important;color:var(--bf-heading-ink)!important;margin:0 0 26px!important}
body .project-dialog .bf-case .bf-title p{font-family:var(--portfolio-body)!important;font-size:11px!important;font-weight:400!important;line-height:1.4!important;letter-spacing:.13em!important;color:var(--bf-label-ink)!important;margin:0 0 var(--bf-label-title-gap)!important}
body .bf-case .bf-website-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-height:46px;padding:12px 22px;margin-bottom:26px;border:1px solid #62352166;border-radius:999px;background:transparent;color:#623521!important;text-decoration:none;font-size:14px!important;line-height:1.4}
body .bf-case .bf-website-button:hover{border-color:#E11B0C;color:#E11B0C!important}
@media(max-width:800px){.bf-case{--bf-heading-size:32px}.bf-opening{display:block;margin-top:16px}.bf-website-button{margin-top:0!important;margin-bottom:0!important}}
body .project-dialog .project-window-panel.bf-case .bf-document .bf-title p{font-size:11px!important;line-height:1.4!important;letter-spacing:.13em!important}
.bf-project-links{display:flex;flex-wrap:wrap;align-items:center;gap:20px 32px;margin-top:28px}
body .project-dialog .bf-case .bf-description .bf-project-links{display:grid!important;grid-template-columns:max-content max-content;column-gap:40px!important;row-gap:20px!important;align-items:start;margin-top:28px}
body .project-dialog .bf-case .bf-project-links>a{display:block!important;width:fit-content;max-width:100%;padding:8px 0;line-height:1.5;text-decoration:underline;text-underline-offset:6px}
@media(max-width:650px){body .project-dialog .bf-case .bf-description .bf-project-links{grid-template-columns:minmax(0,1fr);row-gap:16px!important}}
/* Product-motion showcase: the same measured case typography and 1000px column. */
.bf-values{margin:0 0 64px}.bf-values-intro{max-width:660px;margin:0 0 48px}
body .project-dialog .project-window-panel.bf-case .bf-section-label{font-size:11px!important;line-height:1.4!important;letter-spacing:.13em!important;font-weight:400!important;color:#736a65!important;margin:0 0 28px!important}
body .project-dialog .project-window-panel.bf-case .bf-values h2{font-family:'Hepta Slab',serif!important;font-size:40px!important;line-height:1.18!important;letter-spacing:-.045em!important;font-weight:400!important;color:#623521!important;margin:0 0 24px!important;text-transform:none}
body .project-dialog .project-window-panel.bf-case .bf-values h3{font-family:'Hepta Slab',serif!important;font-size:32px!important;line-height:1.18!important;letter-spacing:-.045em!important;font-weight:400!important;color:#623521!important;margin:0 0 24px!important;text-transform:none}
body .project-dialog .project-window-panel.bf-case .bf-values p:not(.bf-section-label){font-size:16px!important;line-height:1.6!important;color:#64615f!important;margin:0!important}
.bf-value-row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:center;padding:56px 0;border-top:1px solid #62352126}
.bf-value-copy{max-width:390px}.bf-value-figure{margin:0;min-width:0}.bf-animation-stage{position:relative;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:#080808;isolation:isolate}
.bf-animation-poster,.bf-lottie{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.bf-lottie{opacity:0}.bf-animation-ready .bf-lottie{opacity:1}.bf-animation-ready .bf-animation-poster{visibility:hidden}
.bf-value-figure figcaption{display:flex;justify-content:flex-end;min-height:44px;margin-top:8px}
body .bf-case .bf-animation-toggle,body .bf-case .bf-animation-fallback{font-family:var(--portfolio-body)!important;font-size:13px!important;font-weight:400!important;letter-spacing:0;text-transform:none;background:transparent;border:0;color:#623521!important;padding:10px 0 10px 16px;cursor:pointer;text-underline-offset:4px}
.bf-animation-toggle:hover{text-decoration:underline}.bf-animation-toggle[hidden],.bf-animation-fallback[hidden]{display:none!important}
.bf-values-links{max-width:820px;margin:0 auto 64px}body .project-dialog .bf-case .bf-values-links .bf-project-links{display:flex!important;gap:24px 40px!important;flex-wrap:wrap}
@media(max-width:800px){.bf-value-row{gap:32px}body .project-dialog .project-window-panel.bf-case .bf-values h2{font-size:32px!important}body .project-dialog .project-window-panel.bf-case .bf-values h3{font-size:28px!important}}
@media(max-width:650px){.bf-values-intro{margin-bottom:32px}.bf-value-row{grid-template-columns:1fr;gap:24px;padding:36px 0}.bf-value-copy{max-width:none}.bf-animation-stage{border-radius:12px}.bf-values{margin-bottom:36px}.bf-values-links{margin-bottom:40px}body .project-dialog .bf-case .bf-values-links .bf-project-links{flex-direction:column;align-items:flex-start}}

/* Closing project details share the showcase's left edge. */
.bf-case .bf-values-links{max-width:none;margin:0 0 64px;text-align:left}
.bf-case .bf-values-links .bf-meta{grid-template-columns:1fr;gap:24px;margin:0;padding-top:32px}
.bf-case .bf-values-links .bf-project-links{justify-content:flex-start;margin-top:28px}

.bf-case .bf-values-links .bf-meta{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px}
.bf-case .bf-description{margin-left:0;margin-right:0;text-align:left}
.bf-case .bf-value-figure figcaption:has(.bf-animation-fallback[hidden]){display:none}
@media(max-width:650px){.bf-case .bf-values-links .bf-meta{column-gap:20px}}

.bf-case .bf-next-case{padding:48px 0 64px;border-top:1px solid #62352126}
.bf-next-amtrak{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#093b59}
.bf-case .bf-next-amtrak img{width:70%;height:auto;filter:brightness(0) invert(1);border-radius:0}
.bf-case .bf-next-amtrak{background:radial-gradient(ellipse at 22% 90%,#9bc5d8 0,transparent 52%),radial-gradient(ellipse at 65% 32%,#7295ab 0,transparent 45%),linear-gradient(135deg,#00476b,#163049)}
/* Shared animated BeFreed preview. */
body .bf-motion-thumbnail{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:28px;background:#080808;isolation:isolate}
body .bf-motion-thumbnail>img,body .bf-thumbnail-lottie{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:0!important;pointer-events:none}
body .bf-thumbnail-lottie{opacity:0}
body .bf-motion-thumbnail.is-ready .bf-thumbnail-lottie{opacity:1}
body .bf-motion-thumbnail.is-ready>img{visibility:hidden}

/* Reuse the actual Amtrak hero layers and motion in the next-case preview. */
.bf-case .bf-next-amtrak{background:#00537e}
.bf-case .bf-next-amtrak>.amtrak-glass-hero{position:absolute;inset:0;width:100%;height:100%;min-height:0;z-index:0;border-radius:inherit}
.bf-case .bf-next-amtrak>img{position:relative;z-index:1}

/* User-supplied looping film uses the existing project-preview frame. */
body .bf-video-thumbnail{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:28px;background:#080808;pointer-events:none}
@media(max-width:650px){body .bf-video-thumbnail{border-radius:22px}}

/* Landing opening aligned with the BeFreed App introduction. */
body .project-dialog .bf-case>header.story-toolbar{position:absolute!important;inset:0 0 auto;z-index:10;background:transparent!important;pointer-events:none}
body .project-dialog .bf-case>header.story-toolbar button{pointer-events:auto;background:transparent!important}
body .project-dialog .bf-case .ba-logo-art img{width:100%!important;max-width:none!important;height:auto!important;filter:none;display:block;margin:0!important;border-radius:0!important}
body .project-dialog .bf-case .bf-document{padding-top:80px}
.bf-aligned-hero{max-width:1024px;margin:0 auto;padding-bottom:64px}
body .project-dialog .bf-case .bf-aligned-hero h1{font:400 40px/1.18 'Hepta Slab',serif!important;color:#623521!important;letter-spacing:-.045em!important;margin:0 0 26px!important}
body .project-dialog .bf-case .bf-hero-kicker{font:400 11px/1.4 var(--portfolio-body)!important;letter-spacing:.13em!important;color:#736a65!important;margin:0 0 28px!important}
body .project-dialog .bf-case .bf-hero-lead{font:400 18px/1.6 var(--portfolio-body)!important;color:#64615f!important;max-width:730px;margin:0 0 22px!important}
body .project-dialog .bf-aligned-hero .bf-website-button{display:inline-flex;gap:24px;min-height:52px;box-sizing:border-box;padding:12px 20px;margin:8px 0 28px;border:1px solid #29251f;border-radius:8px;background:#29251f;color:#fff!important;font:500 15px/1.5 var(--portfolio-body)!important;box-shadow:0 12px 18px #00000014}
body .project-dialog .bf-aligned-hero .bf-website-button span{color:inherit!important}
body .project-dialog .bf-aligned-hero .bf-website-button:hover{background:#623521;border-color:#623521}
.bf-hero-meta{display:grid;grid-template-columns:1fr 1fr;gap:24px 40px;max-width:730px;margin:20px 0 0}
body .project-dialog .bf-case .bf-hero-meta dt{font:400 12px/1.5 var(--portfolio-body)!important;color:#77716b!important;margin-bottom:6px}
body .project-dialog .bf-case .bf-hero-meta dd{font:400 14px/1.5 var(--portfolio-body)!important;color:#623521!important;margin:0}
.bf-case.ba-background-paused .ba-brand-background *{animation-play-state:paused!important}
@media(max-width:800px){body .project-dialog .bf-case .bf-document{padding-top:64px}body .project-dialog .bf-case .bf-aligned-hero h1{font-size:32px!important}}
@media(max-width:600px){body .project-dialog .bf-case .bf-document{padding-top:56px}.bf-aligned-hero{padding-bottom:48px}.bf-hero-meta>div:last-child{grid-column:1/-1}}

/* Begin directly with the project introduction, without the brand cover. */
body .project-dialog .bf-case:not(.bm-case) .bf-document{padding-top:120px}
@media(max-width:650px){body .project-dialog .bf-case:not(.bm-case) .bf-document{padding-top:96px}}

/* Keep the recording within its native display width to avoid enlargement blur. */
body .project-dialog .bf-case .bf-film{width:100%;max-width:960px;margin-inline:auto}

/* One-tap playback speed, scoped to the landing-page film controls. */
body .bf-controls .bf-speed{width:56px;min-width:56px;height:44px;padding:0 8px;border:1px solid #f7f7f54d;border-radius:999px;background:#f7f7f514;color:#f7f7f5!important;font:600 13px/1 var(--portfolio-body,Arial,sans-serif);font-variant-numeric:tabular-nums;letter-spacing:0;white-space:nowrap;touch-action:manipulation;transition:background .16s ease,border-color .16s ease,transform .16s ease}
body .bf-controls .bf-speed[data-accelerated="true"]{background:#f1eee5;border-color:#f1eee5;color:#29251f!important}
@media(hover:hover){body .bf-controls .bf-speed:hover{background:#f1eee5;border-color:#f1eee5;color:#29251f!important}}
body .bf-controls .bf-speed:active{transform:scale(.94)}
@media(max-width:650px){body .bf-controls .bf-speed{width:48px;min-width:48px;height:44px;padding:0 6px;font-size:12px}}
@media(prefers-reduced-motion:reduce){body .bf-controls .bf-speed{transition:none}}

/* Keep playback reachable while paused or loading, including touch input. */
.bf-film.bf-paused .bf-controls,.bf-film.bf-loading .bf-controls,.bf-film.bf-paused .bf-big-play{opacity:1;pointer-events:auto}
.bf-film.bf-loading .bf-big-play{display:none!important}
.bf-film .bf-player-status:not(:empty){z-index:3;pointer-events:none;padding:12px 18px;line-height:1.5}

/* Give the landing demo more room while retaining the editorial column. */
body .project-dialog .bf-landing-case .bf-document{box-sizing:border-box;width:100%;max-width:1200px}
body .project-dialog .bf-landing-case .bf-document> :is(.bf-aligned-hero,.bf-values,.bf-values-links,.story-footer){box-sizing:border-box;width:100%;max-width:1000px;margin-inline:auto}
body .project-dialog .bf-landing-case .bf-film:not(:fullscreen){box-sizing:border-box;width:100%;max-width:1104px;margin-inline:auto}
