.mfb {
--white: #FFFFFF;
--surface-panel: #f2f3f2;
--surface-box: #e7e8e9;
--surface-tab: #dbdbdb;
--surface-tab-alt: #e8e9e8;
--surface-tier: #f1f2f4;
--surface-archive: #f7f7f7;
--surface-gradient: #f5f5f5;
--surface-gray: #E0E0E0;
--footer: #bcbec0;
--newsletter-form: #bdbec2;
--black: #000000;
--fg: #000000;
--fg-form: #231f20;
--fg-muted: #6d6e71;
--fg-tab: #878787;
--accent: #5D92A8;
--accent-link: #6191a7;
--gray-btn: #74777a;
--gray-btn-dark: #5e6164;
--gray-btn-coll: #5e5b5d;
--live: #F07C56;
--live-active: #BD1E2C;
--rule: #000000;
--rule-soft: #bcbfc1;
--class-teal: #264653;
--class-green: #2A9D8F;
--class-brown: #68534E;
--class-rust: #7C3607;
--class-slate: #343A40;
--class-steel: #9EAFBF;
--class-olive: #897756;
--class-sage: #778C7B;
--class-blue: #0075BA;
--class-plum: #9C6D81;
--class-sand: #DDC7A6;
--class-amber: #F2BE5E;
--sans: 'Work Sans', sans-serif;
--heading: 'Barlow', sans-serif;
--display: 'Barlow Condensed', 
sans-serif;
--fs-body: 1rem;
--fs-body-sm: 0.9375rem;
--fs-meta: 0.875rem;
--fs-eyebrow: 13px;
--fs-h1: 3.375rem;
--fs-h2: 2.6875rem;
--fs-h3: 32px;
--fs-h4: 1.75rem;
--fs-h5: 24px;
--fs-h6: 1.375rem;
--fs-section: 34px;
--fs-display-xl: 60px;
--fs-display-lg: 48px;
--fs-display-md: 40px;
--fs-display-sm: 38px;
--fs-display-xs: 30px;
--fw-regular: 400;
--fw-medium: 500;
--fw-semibold: 600;
--fw-bold: 700;
--lh-body: 1.4;
--lh-heading: 1.13;
--lh-display: 1;
--tr-eyebrow: 0.12em;
--tr-btn: 0.05em;
--tr-caps: 0.03em;
--container-max: 1600px;
--section-y: 70px;
--section-y-sm: 50px;
--card-pad: 32px;
--card-head-h: 210px;
--hero-img-h: 510px;
--skew: 20deg;
--space-1: 4px; --space-2: 8px; --space-3: 15px;
--space-4: 16px; --space-5: 25px; --space-6: 32px;
--space-7: 48px; --space-8: 70px; --space-9: 96px;
--radius-0: 0;
--radius-tier: 2px;
--radius-chip: 3px;
--radius-img: 8px;
--radius-block: 16px;
--dur-skew: 400ms;
--dur-overlay: 300ms;
--dur-photos: 60s;
--hover-fade: 0.85;
}
.mfb *, .mfb ::after, .mfb ::before { box-sizing: border-box; }
 {
margin: 0;
background-color: var(--white);
font-family: var(--sans);
font-weight: var(--fw-regular);
font-size: var(--fs-body);
line-height: var(--lh-body);
color: var(--fg);
}
.mfb .container-fluid { max-width: var(--container-max); }
.mfb p { margin-bottom: 2rem; }
.mfb ul, .mfb ol { margin-bottom: 3rem; margin-left: 2rem; }
.mfb ul li, .mfb ol li { margin-bottom: 1rem; }
.mfb h1, .mfb h2, .mfb h3, .mfb h4, .mfb h5, .mfb h6 {
font-family: var(--heading);
font-weight: var(--fw-semibold);
line-height: var(--lh-heading);
margin-top: 0;
}
.mfb h1 { font-size: var(--fs-h1); margin-bottom: 3.5rem; }
.mfb h2 { font-size: var(--fs-h2); margin-bottom: 2.55rem; }
.mfb h3 { font-size: var(--fs-h3); margin-bottom: 1.6rem; }
.mfb h4 { font-size: var(--fs-h4); margin-bottom: 1.55rem; }
.mfb h5 { font-size: var(--fs-h5); margin-bottom: 1.25rem; }
.mfb h6 { font-size: var(--fs-h6); margin-bottom: 1.25rem; }
.mfb h2.section-title { font-size: var(--fs-section); margin-bottom: 1rem; }
.mfb b, .mfb strong { font-family: var(--sans); font-weight: var(--fw-medium); }
.mfb h1 b, .mfb h2 b, .mfb h3 b, .mfb h4 b, .mfb h5 b, .mfb h6 b, .mfb h1 strong, .mfb h2 strong, .mfb h3 strong, .mfb h4 strong, .mfb h5 strong, .mfb h6 strong {
font-family: var(--heading); font-weight: var(--fw-semibold);
}
.mfb a { color: var(--fg); text-decoration: underline; }
.mfb a:hover, .mfb a:focus { color: var(--fg); text-decoration: underline; }
.mfb h1 a, .mfb h1 a:hover, .mfb h2 a, .mfb h2 a:hover, .mfb h3 a, .mfb h3 a:hover { text-decoration: none; }
.mfb hr, .mfb .separator {
height: 0;
border: 0;
border-top: 2px solid var(--rule);
width: 150px;
margin-bottom: 2rem;
display: inline-block;
}
.mfb .separator-large {
height: 0;
border: 0;
border-top: 1px solid var(--rule);
max-width: 600px;
margin-bottom: 15px;
}
.mfb .separator-large.full { max-width: 100%; }
.mfb .slide-label, .mfb .class-header__eyebrow, .mfb .class-card-label {
font-family: var(--sans);
font-weight: var(--fw-medium);
font-size: var(--fs-eyebrow);
letter-spacing: var(--tr-eyebrow);
text-transform: uppercase;
margin-bottom: 5px;
white-space: nowrap;
}
.mfb .class-card-label { font-size: 16px; }
.mfb .single-class-author, .mfb .slide-content h1 {
font-family: var(--display);
font-weight: var(--fw-semibold);
font-size: var(--fs-display-xl);
line-height: var(--lh-display);
text-transform: uppercase;
margin-bottom: 8px;
}
.mfb h1.single-class-title, .mfb .slide-content h2, .mfb .slide-content h4 {
font-family: var(--display);
font-weight: var(--fw-medium);
font-size: var(--fs-display-lg);
line-height: var(--lh-display);
margin-bottom: 15px;
text-transform: none;
}
.mfb .slide-class-title {
font-family: var(--display);
font-weight: var(--fw-semibold);
font-size: var(--fs-display-sm);
line-height: var(--lh-display);
margin: 0;
color: var(--fg);
}
.mfb .slide-live {
font-family: var(--display);
font-weight: var(--fw-medium);
font-size: 22px;
line-height: var(--lh-display);
margin-bottom: 15px;
}
.mfb .slide-live-single p, .mfb .single-class .class-hero .slide-live p {
font-family: var(--heading);
font-weight: var(--fw-semibold);
font-size: 21px;
line-height: 1.2;
margin-bottom: 0;
}
.mfb .in-conversation { font-family: var(--sans); font-weight: var(--fw-medium); font-size: 1.3rem; }
.mfb .presented-by { font-family: var(--sans); font-weight: var(--fw-medium); font-size: 1rem; }
.mfb .tagline { font-family: var(--sans); font-weight: var(--fw-regular); font-size: 1.3rem; display: inline-block; }
.mfb .tagline-wrapper h4 { font-family: var(--sans); font-weight: var(--fw-regular); font-size: 18px; line-height: 1.3; color: var(--fg-muted); }
.mfb .slide-view-more, .mfb .archive-link { font-family: var(--sans); font-weight: var(--fw-medium); text-transform: uppercase; font-size: 0.95em; }
.mfb .uppercase { text-transform: uppercase; }
.mfb .btn, .mfb .gform_button {
display: inline-block;
font-family: var(--sans);
font-size: var(--fs-body);
line-height: 1.1;
font-weight: var(--fw-regular);
text-transform: uppercase;
letter-spacing: var(--tr-btn);
border: 0;
border-radius: var(--radius-0);
padding: 0.8rem 1.7rem;
margin-bottom: 2rem;
text-align: left;
text-decoration: none;
cursor: pointer;
}
.mfb .btn:hover, .mfb .gform_button:hover { opacity: var(--hover-fade); }
.mfb .btn-primary, .mfb .gform_button {
background-color: var(--accent);
color: var(--white);
}
.mfb .btn-primary:hover { background-color: var(--black); color: var(--white); opacity: 1; }
.mfb .btn-secondary { background-color: var(--white); color: var(--fg); }
.mfb .btn-outline-secondary {
background-color: var(--white);
color: var(--fg);
border: 1px solid var(--fg);
margin-right: 0.75rem;
}
.mfb .btn-gray { background-color: var(--gray-btn); color: var(--white); text-align: left; }
.mfb .btn-form { background-color: var(--gray-btn-dark); color: var(--white); text-align: left; width: 100%; }
.mfb .slide-buttons .btn-primary { filter: brightness(110%); }
.mfb .class-card-new .btn {
position: relative; margin: 0; padding: 0 16px;
background: transparent; color: var(--fg); text-decoration: none;
}
.mfb .class-card-new .btn::before { content: '//'; position: absolute; left: 0; }
.mfb .slide-logo {
position: relative;
display: inline-block;
float: left;
margin-left: 20px;
padding: 15px;
background-color: var(--black);
color: var(--white);
font-family: var(--sans);
font-weight: var(--fw-semibold);
text-transform: uppercase;
transform: skew(var(--skew));
z-index: 100;
transition: background-color var(--dur-skew) linear;
}
.mfb .slide-logo > img, .mfb .slide-logo span { transform: skew(calc(-1 * var(--skew))); }
.mfb .slide-logo span { display: block; font-weight: var(--fw-regular); font-size: 24px; line-height: 1.25; letter-spacing: 1px; color: var(--white); }
.mfb .slide-logo .arrow-down {
position: absolute; left: 0; bottom: -40px; content: "";
border-left: 15px solid var(--black);
border-right: 40px solid transparent;
border-top: 40px solid transparent;
border-bottom: 40px solid transparent;
transition: border-left-color var(--dur-skew) linear;
}
.mfb .nav-home-events, .mfb .nav-single-class { margin: 0; padding: 0; list-style: none; overflow: hidden; display: flex; }
.mfb .nav-home-events .nav-item, .mfb .nav-single-class .nav-item {
transform: skew(var(--skew));
margin-bottom: -1px;
background-color: var(--surface-tab);
border-left: 2px solid var(--white);
}
.mfb .nav-home-events .nav-item { width: 33.33%; }
.mfb .nav-single-class .nav-item { width: 50%; }
.mfb .nav-home-events .nav-item a {
display: block; padding: 0 2rem; margin-bottom: 0;
font-family: var(--heading); font-size: 26px; line-height: 75px;
font-weight: var(--fw-semibold); text-decoration: none;
}
.mfb .slide {
--class-color: var(--class-teal);
--class-ink: var(--white);
position: relative; display: flex; flex-direction: column; height: 100%;
background-position: center; background-size: cover;
}
.mfb .slide-gradient { position: relative; overflow: hidden; flex-shrink: 1; }
.mfb .slide-gradient::before {
content: ""; position: absolute; inset: 0; z-index: 0;
background: linear-gradient(-90deg, color-mix(in srgb, var(--class-color) 75%, transparent) 0%, var(--surface-gradient) 100%);
}
.mfb .slide-gradient.is-reversed::before {
background: linear-gradient(-90deg, var(--surface-gradient) 0%, color-mix(in srgb, var(--class-color) 75%, transparent) 100%);
}
.mfb .slide-author-head { position: relative; height: var(--card-head-h); }
.mfb .slide-author-head-image {
position: relative; z-index: 1; height: 100%;
display: flex; align-items: center; padding: var(--card-pad);
background-repeat: no-repeat; background-position: 110% 100%; background-size: auto 114%;
}
.mfb .slide-author-head-image .slide-class-title { width: 58.333%; }
.mfb .slide-meta { position: relative; flex-grow: 1; background-color: var(--class-color); color: var(--class-ink); }
.mfb .slide-meta::before {
content: ""; position: absolute; left: 0; top: -60px; z-index: 1024;
border-left: 30px solid var(--class-color);
border-top: 80px solid transparent;
}
.mfb .slide-content { display: flex; flex-direction: column; height: 100%; padding: 2rem; }
.mfb .slide-meta .slide-label,
.mfb .slide-meta .slide-content h4 a,
.mfb .slide-meta .slide-description p,
.mfb .slide-meta .presented-by { color: var(--class-ink); }
.mfb .slide-meta .separator-large { border-top-color: var(--class-ink); max-width: none; margin-bottom: 15px; }
.mfb .slide-meta .slide-label { margin: 0 0 5px; }
.mfb .slide-meta .slide-content h4 { min-height: 100px; margin: 0 0 1.5rem; }
.mfb .slide-meta .slide-content h4 a { text-decoration: none; }
.mfb .slide-description p, .mfb .slide-excerpt p {
font-family: var(--sans); font-weight: var(--fw-regular); font-size: 0.94rem;
line-height: var(--lh-body); margin-bottom: 0;
}
.mfb .slide-description p:empty { display: none; }
@media (max-width: 991.98px) {
.mfb .slide-content { background-color: var(--class-color); }
}
.mfb .slide-overlay {
position: absolute; inset: 0; z-index: 1030; display: none;
width: 100%; height: 100%; background: rgba(0,0,0,0.75);
}
.mfb .slide:hover .slide-overlay, .mfb .slide.is-hover .slide-overlay { display: block; }
.mfb .slide-overlay a { position: absolute; inset: 0; display: flex; text-decoration: none; }
.mfb .slide-overlay .slide-buttons { display: flex; flex-direction: column; margin: auto; }
.mfb .slide-overlay .btn-secondary { border-radius: var(--radius-chip); color: var(--fg); font-weight: var(--fw-medium); margin: 0; }
.mfb .slide-overlay .btn-secondary:hover { background-color: var(--white); }
.mfb .slide-ribon {
position: absolute; inset: 10px auto auto -10px; z-index: 1100;
padding: 1px 20px 11px 20px;
background-color: var(--class-color);
clip-path: polygon(calc(100% - 8px) 0, 100% 24px, 10px 24px, 10px 34px, 0 24px, 0 0);
box-shadow: 0 -10px 0 inset #0005;
color: var(--white);
}
.mfb .slide-ribon .slide-view-more { margin: 0; color: var(--white); }
.mfb .slide-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem 30px; }
.mfb .box, .mfb section.buy-ticket { background: var(--surface-box); }
.mfb .box h2.box-title {
font-family: var(--sans); font-weight: var(--fw-bold); font-size: 18px;
letter-spacing: var(--tr-caps); text-transform: uppercase; margin-bottom: 1.2rem;
}
.mfb section.home-events, .mfb section.content, .mfb section.buy-ticket, .mfb section.faq, .mfb section.about-author { padding: var(--section-y) 0; }
.mfb section.newsletter .newsletter-content { background-color: var(--black); }
.mfb section.newsletter .newsletter-content :is(h1,h2,h3,h4,p,label) { color: var(--white); }
.mfb section.newsletter .newsletter-content h1 { font-family: var(--display); font-size: 4rem; line-height: 1; }
.mfb section.newsletter .newsletter-content h3 { font-family: var(--sans); font-size: 28px; font-weight: var(--fw-regular); }
.mfb .newsletter .form-box input { border: 2px solid var(--white); }
.mfb .newsletter .form-box .btn-outline-secondary { color: var(--white); border-color: var(--white); }
.mfb .newsletter-form { background-color: var(--newsletter-form); color: var(--fg); }
.mfb .top { background-color: var(--white); padding: 30px 0 0 0; }
.mfb header a { font-family: var(--sans); font-weight: var(--fw-regular); text-transform: uppercase; }
.mfb .social-item a { display: block; padding: 0 4px; margin-top: 4px; }
.mfb .social-item a img { width: 27px; height: 27px; }
.mfb .menu-item.separator-item { width: 20px; }
.mfb footer { background-color: var(--footer); padding: 6rem 0 3rem 0; }
.mfb footer img { height: 110px; }
.mfb footer .powered-by img { border-left: 3px solid var(--black); padding-left: 3rem; }
.mfb .copyrights { padding: 2rem 0 0 0; font-size: 0.9rem; }
.mfb .copyrights a { text-decoration: underline; }
.mfb #collection-header { position: relative; height: 360px; margin: 0 auto; overflow: hidden; }
.mfb #collection-header img { max-height: 360px; }
.mfb .collection-header-text h2 {
font-family: var(--display); font-weight: var(--fw-semibold);
font-size: var(--fs-display-md); line-height: 0.9em;
text-transform: uppercase; margin-bottom: 1rem;
}
.mfb .collection-header-text h4 { font-family: var(--sans); font-weight: var(--fw-regular); font-size: 1.45rem; color: var(--fg-muted); margin-bottom: 0; }
.mfb .collection-header-photos { position: absolute; top: 0; left: 0; padding: 0; overflow: hidden; white-space: nowrap; animation: photosmove var(--dur-photos) linear infinite; }
@keyframes photosmove { 0% { transform: translate(0,0); } 100% { transform: translate(-50%,0); } }
.mfb .category-header-wrapper h2 { font-family: var(--display); font-size: var(--fs-display-xl); }
.mfb .category-header-wrapper h3 { font-family: var(--display); font-size: var(--fs-display-xs); }
.mfb .category-featured-image { background-color: var(--white); border-radius: var(--radius-img); padding: 16px; display: inline-block; overflow: hidden; }
.mfb .category-past-wrapper, .mfb .category-current-wrapper { background-color: var(--surface-archive); }
.mfb .taxonomy-title h2 { font-size: 28px; }
.mfb .taxonomy-view-more { font-size: 1.1rem; font-weight: 300; text-transform: none; text-decoration: underline; }
.mfb .series-title h2 { font-family: var(--display); font-size: var(--fs-display-xl); padding: 20px 25px; display: inline-block; margin: 0; }
.mfb .faq-item { border-bottom: 1px solid var(--surface-tab); }
.mfb .faq-item > a { display: block; padding: 16px 0; font-family: var(--heading); font-weight: var(--fw-semibold); font-size: var(--fs-h6); line-height: var(--lh-heading); text-decoration: none; }
.mfb .faq-item > p { font-size: var(--fs-body-sm); margin: 0 0 18px; }

/* ===== Five Books comps: layer on top of the v5 theme classes. Prefix fb-. ===== */
{scroll-behavior:auto}
.mfb img{max-width:100%;display:block}
.mfb .wrap{max-width:var(--container-max);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.mfb .inner{width:83.333%;margin:0 auto}
@media (max-width:991.98px){.mfb .inner{width:100%}}
{background:var(--surface-box);font-size:var(--fs-meta);padding:10px 0}
{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
{font-weight:var(--fw-semibold);letter-spacing:var(--tr-caps);text-transform:uppercase;font-size:12px}
/* header stand-in for the WordPress theme header */
.mfb .top .wrap{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-bottom:30px}
.mfb .brandrow{display:flex;align-items:flex-start;gap:28px}
.mfb .slide-logo{float:none}
.mfb .slide-logo span{font-size:18px;line-height:1.2}
.mfb .tagline-wrapper h4{margin:12px 0 0}
.mfb nav.main{display:flex;gap:26px;align-items:center;flex-wrap:wrap;padding-top:14px}
.mfb nav.main a{text-decoration:none;font-size:15px;letter-spacing:var(--tr-caps)}
.mfb nav.main a.is-current{border-bottom:2px solid var(--fg);padding-bottom:4px}
.mfb section.content{padding:var(--section-y) 0}
@media (max-width:991.98px){.mfb section.content{padding:var(--section-y-sm) 0}}
.mfb .eyebrow{font-family:var(--sans);font-weight:var(--fw-medium);font-size:var(--fs-eyebrow);letter-spacing:var(--tr-eyebrow);text-transform:uppercase;margin:0 0 5px;display:block}
.mfb .lockup{display:inline-flex;flex-direction:column}
.mfb .lockup .separator-large{width:100%;max-width:none;margin:4px 0 6px}
.mfb .display-xl{font-family:var(--display);font-weight:var(--fw-semibold);font-size:var(--fs-display-xl);line-height:var(--lh-display);text-transform:uppercase;margin:0}
.mfb .display-lg{font-family:var(--display);font-weight:var(--fw-medium);font-size:var(--fs-display-lg);line-height:var(--lh-display);margin:0}
.mfb .display-md{font-family:var(--display);font-weight:var(--fw-semibold);font-size:var(--fs-display-md);line-height:var(--lh-display);text-transform:uppercase;margin:0}
.mfb .lede{font-size:1.125rem;max-width:66ch}
.mfb .measure{max-width:66ch}
.mfb .measure p{margin-bottom:1.4rem}
.mfb .cols{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:start}
.mfb .cols-2{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
@media (max-width:991.98px){.mfb .cols,.mfb .cols-2{grid-template-columns:1fr;gap:28px}}
/* video frame: 16:9, poster, flat play mark (single colour, drawn in a 27px box per the DS icon rule) */
.mfb .frame{position:relative;aspect-ratio:16/9;background:#000 center/cover no-repeat;overflow:hidden;display:block;text-decoration:none;color:var(--white)}
.mfb .frame .play{position:absolute;left:0;bottom:0;width:54px;height:54px;background:var(--black);display:flex;align-items:center;justify-content:center}
.mfb .frame .play::before{content:"";width:0;height:0;border-left:14px solid var(--white);border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:3px}
.mfb .frame .dur{position:absolute;right:0;bottom:0;background:var(--black);color:var(--white);font-family:var(--sans);font-weight:var(--fw-medium);font-size:13px;letter-spacing:1px;padding:0 12px;line-height:54px}
.mfb .frame .ov{position:absolute;inset:0;background:rgba(0,0,0,.75);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity var(--dur-overlay) ease-in-out}
.mfb .frame:hover .ov,.mfb .frame:focus-visible .ov{opacity:1}
.mfb .frame .chip{background:var(--white);color:var(--fg);font-family:var(--sans);font-weight:var(--fw-medium);font-size:var(--fs-body);letter-spacing:var(--tr-btn);text-transform:uppercase;padding:.8rem 1.7rem;border-radius:var(--radius-chip)}
/* placed type on first paint (motion addendum C): one axis, once, no scroll triggers */
.mfb .place{clip-path:inset(-10% 100% -10% 0);animation:place var(--dur-skew) cubic-bezier(.2,0,0,1) forwards}
.mfb .place.d1{animation-delay:80ms}.mfb .place.d2{animation-delay:160ms}
@keyframes place{to{clip-path:inset(-10% -2% -10% 0)}}
@media (prefers-reduced-motion:reduce){.mfb .place{animation:none;clip-path:none}}
/* film rows (D2) */
.mfb .film{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:start;padding:40px 0;border-top:1px solid var(--rule)}
.mfb .film:last-child{border-bottom:1px solid var(--rule)}
.mfb .film h3{margin:6px 0 12px}
.mfb .film p{margin:0;font-size:var(--fs-body-sm)}
@media (max-width:991.98px){.mfb .film{grid-template-columns:1fr;gap:18px;padding:28px 0}}
/* callout panels */
.mfb .panel{background:var(--surface-box);padding:48px 0}
.mfb .panel .btn{margin-bottom:0}
.mfb .panel-black{background:var(--black);color:var(--white);padding:56px 0}
.mfb .panel-black .eyebrow,.mfb .panel-black h2,.mfb .panel-black p{color:var(--white)}
.mfb .panel-black .separator-large{border-top-color:var(--white)}
/* guest grid (D3) */
.mfb .guests{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
@media (max-width:991.98px){.mfb .guests{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.mfb .guests{grid-template-columns:1fr}}
.mfb .guest{border-top:2px solid var(--rule);padding-top:16px;min-height:250px;display:flex;flex-direction:column;text-decoration:none;color:var(--fg)}
.mfb .guest .num{font-family:var(--display);font-weight:var(--fw-semibold);font-size:var(--fs-display-xl);line-height:1}
.mfb .guest .who{font-family:var(--heading);font-weight:var(--fw-semibold);font-size:var(--fs-h5);line-height:var(--lh-heading);margin:18px 0 8px}
.mfb .guest .what{font-size:var(--fs-body-sm);color:var(--fg-muted);margin:0}
.mfb .guest.tk .who,.mfb .guest.tk .num{color:var(--fg-tab)}
.mfb .guest .img{aspect-ratio:16/9;background:var(--surface-gradient) center/cover no-repeat;margin-top:auto}
/* five books list (D4) */
.mfb .books{list-style:none;margin:0;padding:0;counter-reset:b}
.mfb .books li{display:grid;grid-template-columns:120px 1fr;gap:24px;align-items:baseline;padding:28px 0;border-top:1px solid var(--rule);margin:0}
.mfb .books li:last-child{border-bottom:1px solid var(--rule)}
.mfb .books .n{font-family:var(--display);font-weight:var(--fw-semibold);font-size:var(--fs-display-xl);line-height:1}
.mfb .books .t{font-family:var(--heading);font-weight:var(--fw-semibold);font-size:var(--fs-h3);line-height:var(--lh-heading);margin:0}
.mfb .books .a{font-size:var(--fs-body);margin:6px 0 0}
.mfb .books .why{font-size:var(--fs-body-sm);color:var(--fg-muted);margin:10px 0 0;max-width:60ch}
@media (max-width:640px){.mfb .books li{grid-template-columns:70px 1fr;gap:16px}.mfb .books .n{font-size:var(--fs-display-md)}}
.mfb .coda{margin-top:20px;font-size:var(--fs-body)}
/* newsletter + footer stand-ins */
.mfb section.newsletter .newsletter-content{padding:56px 0}
.mfb section.newsletter .newsletter-content h1{margin-bottom:1rem}
.mfb .nl-form{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.mfb .nl-form input{background:transparent;border:2px solid var(--white);color:var(--white);font-family:var(--sans);font-size:var(--fs-body);padding:.7rem 1rem;min-width:260px}
.mfb .nl-form .btn{margin:0;border:1px solid var(--white)}
.mfb footer .wrap{display:flex;gap:40px;align-items:center;flex-wrap:wrap}
.mfb footer .mark{font-family:var(--sans);font-weight:var(--fw-semibold);text-transform:uppercase;font-size:14px;letter-spacing:1px}
.mfb .btn{margin-bottom:0}
.mfb .links{display:flex;gap:28px;align-items:center;flex-wrap:wrap;margin-top:24px}
.mfb .links a.plain{font-weight:var(--fw-medium);text-transform:uppercase;font-size:.95em;letter-spacing:var(--tr-btn)}
.mfb .live-line{font-family:var(--heading);font-weight:var(--fw-semibold);font-size:21px;line-height:1.2;margin:0 0 18px}
.mfb .tbc{display:inline-block;background:var(--white);border:1px solid var(--fg);font-size:12px;letter-spacing:1px;text-transform:uppercase;padding:3px 8px;margin-left:10px;vertical-align:middle}

/* ===== v1.1 fixes from independent QA ===== */
.mfb .separator-large{display:block;width:100%;max-width:600px}
.mfb .lockup .separator-large{max-width:none}
.mfb .film{border-top:1px solid var(--surface-tab)}
.mfb .film:last-child{border-bottom:1px solid var(--surface-tab)}
.mfb .books li{border-top:1px solid var(--surface-tab)}
.mfb .books li:last-child{border-bottom:1px solid var(--surface-tab)}
.mfb .guest{border-top:1px solid var(--surface-tab)}
.mfb .guest::before{content:"";display:block;width:150px;border-top:2px solid var(--rule);margin:-17px 0 16px}
.mfb h2.film-title{font-size:var(--fs-h3);margin:6px 0 12px}
.mfb .vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mfb .tagline-wrapper p{font-family:var(--sans);font-weight:var(--fw-regular);font-size:18px;line-height:1.3;color:var(--fg-muted);margin:12px 0 0}
.mfb section.newsletter .newsletter-content h2.nl{font-family:var(--display);font-size:4rem;line-height:1;color:var(--white);margin-bottom:1rem;font-weight:var(--fw-semibold)}
/* ===== v2: composed hero + players + class promo ===== */
{margin:0 6px}{margin-left:0}
.mfb .hero{position:relative;aspect-ratio:16/9;background:#000 center/cover no-repeat;overflow:hidden;color:var(--white);font-size:clamp(7px,1.05vw,15px)}
.mfb .hero .corner{position:absolute;left:5%;top:7%;display:inline-flex;flex-direction:column;isolation:isolate}
.mfb .hero .corner::before{content:"";position:absolute;inset:-1.8em -4.5em -1.6em -4em;background:radial-gradient(ellipse at 45% 50%,rgba(0,0,0,.62) 0%,rgba(0,0,0,.42) 42%,rgba(0,0,0,0) 74%);z-index:-1}
.mfb .hero .corner .eyebrow{font-size:1.3em;letter-spacing:.08em;color:var(--white);margin:0;line-height:1.25}
.mfb .hero .corner hr{border:0;border-top:1px solid var(--white);width:100%;margin:.15em 0 .3em}
.mfb .hero .lower{position:absolute;left:0;bottom:7%;padding:1.8em 3em 1.8em 5%;display:flex;flex-direction:column;gap:.45em;align-items:flex-start;max-width:min(60%,70em)}
.mfb .hero .lower.right{left:auto;right:0;padding:1.8em 5% 1.8em 3em}
.mfb .hero .bar{position:absolute;inset:0;background:rgba(0,0,0,.78);z-index:0}
.mfb .hero .lower > :not(.bar){position:relative;z-index:1}
.mfb .hero .name{font-family:var(--display);font-weight:var(--fw-semibold);font-size:5.4em;line-height:.9;text-transform:uppercase;margin:0}
.mfb .hero .sub{font-family:var(--display);font-weight:var(--fw-medium);font-size:2.6em;line-height:1;margin:.1em 0 0}
.mfb .hero .count{font-family:var(--sans);font-weight:var(--fw-medium);font-size:1.2em;letter-spacing:.08em;text-transform:uppercase;opacity:.85;margin:.4em 0 0}
.mfb .hero .lower .eyebrow{font-size:1.3em;letter-spacing:.08em;color:var(--white);margin:0}
.mfb .hero .lower hr{border:0;border-top:1px solid var(--white);width:100%;max-width:none;margin:.2em 0 .5em}
.mfb .hero .lower .btn{margin-top:1.2em;font-size:1.15em;padding:.8em 1.6em}
.mfb .hero .tbc{border-color:var(--white);color:var(--white);background:transparent}
.mfb .player{display:block;width:100%;aspect-ratio:16/9;background:#000}
.mfb .still{position:relative;aspect-ratio:16/9;background:#000 center/cover no-repeat}
.mfb .still .dur{position:absolute;right:0;bottom:0;background:var(--black);color:var(--white);font-family:var(--sans);font-weight:var(--fw-medium);font-size:13px;letter-spacing:1px;padding:0 12px;line-height:54px}
.mfb .measure-wide{max-width:76ch}
.mfb .film .note{font-size:var(--fs-meta);color:var(--fg-muted);margin-top:8px}
@media (max-width:640px){.mfb .hero .lower{max-width:80%}.mfb .hero .name{font-size:4.2em}}
.mfb .hero .corner hr,.mfb .hero .lower hr{display:block;height:0;border:0;border-top:1px solid var(--white);width:100%;max-width:none;margin:.15em 0 .3em}
.mfb .hero .name{font-size:4.8em}
.mfb .hero .lower{padding-right:2.4em}
/* hero: darkened lower frame instead of the bar */
.mfb .hero.shade::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.55) 75%,rgba(0,0,0,.78) 100%);pointer-events:none;z-index:0}
.mfb .hero.shade .lower{max-width:min(70%,80em)}
.mfb .hero.shade .bar{display:none}
.mfb .hero.shade .lower,.mfb .hero.shade .corner{z-index:1}
/* class promo, in the house style of past class promos: light-to-steel gradient, portrait right, type stack left */
.mfb .promo{position:relative;display:grid;grid-template-columns:1fr 1fr;background:linear-gradient(90deg,#f4f4f4 0%,#8c9da4 50%,#274754 100%);min-height:380px;overflow:hidden}
.mfb .promo .copy{padding:9% 6% 9% 6%;display:flex;flex-direction:column;justify-content:center;color:var(--fg)}
.mfb .promo .copy .display-xl{margin:0 0 14px}
.mfb .promo .copy .lockup{display:inline-flex}
.mfb .promo .copy .eyebrow{margin:0}
.mfb .promo .copy .separator-large{margin:4px 0 14px;max-width:none}
.mfb .promo .copy h2{margin:0 0 26px}
.mfb .promo .copy .live-line{margin:0 0 24px}
.mfb .promo .copy .btn{align-self:flex-start}
.mfb .promo img{width:100%;height:100%;object-fit:cover;object-position:center bottom;display:block;align-self:end}
@media (max-width:767.98px){.mfb .promo{grid-template-columns:1fr}.mfb .promo img{max-height:320px;object-position:center 20%}.mfb .promo .copy{background:linear-gradient(90deg,#f4f4f4,#c1c9cc)}}
.mfb .promo .copy .lockup{align-self:flex-start}
/* badge as the theme builds it; small on pages */
.mfb .badge{position:relative;display:inline-block;background:var(--black);padding:12px 16px;transform:skew(var(--skew))}
.mfb .badge img{display:block;transform:skew(calc(-1*var(--skew)));width:120px}
.mfb .badge .tail{position:absolute;left:0;bottom:-32px;border-left:12px solid var(--black);border-right:32px solid transparent;border-top:32px solid transparent;border-bottom:32px solid transparent}
.mfb .badge.sm{padding:10px 14px}.mfb .badge.sm img{width:96px}.mfb .badge.sm .tail{bottom:-26px;border-left-width:10px;border-right-width:26px;border-top-width:26px;border-bottom-width:26px}
.mfb .b-hero .badge{position:absolute;left:5%;top:8%;z-index:2}
.mfb .b-hero .corner::before{display:none}
.mfb .b-hero .play{position:absolute;right:0;bottom:0;width:72px;height:72px;background:var(--black);border:0;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2}
.mfb .b-hero .play::before{content:"";border-left:18px solid var(--white);border-top:11px solid transparent;border-bottom:11px solid transparent;margin-left:4px}
.mfb .b-hero .play:focus-visible{outline:2px solid var(--white);outline-offset:-6px}
.mfb [hidden]{display:none!important}
/* lockup inset: equal left and bottom; darkening kept to the lower third so faces stay clean */
.mfb .hero.shade .lower{left:4.6em;bottom:4.6em;padding:0;max-width:min(70%,80em)}
.mfb .hero.shade::after{background:linear-gradient(180deg,rgba(0,0,0,0) 58%,rgba(0,0,0,.45) 80%,rgba(0,0,0,.8) 100%)}
.mfb .promo .copy{padding:9% 4% 9% 17%}
/* ===== v2.12: index on a 12-column grid (Swiss: one gutter, asymmetric spans, everything on the columns) ===== */
.mfb .g12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:30px;align-items:start}
.mfb .c1-8{grid-column:1/9}.mfb .c1-7{grid-column:1/8}.mfb .c9-12{grid-column:9/13}
.mfb .g12 .lede{max-width:none}
.mfb .guests{column-gap:30px;row-gap:56px}
.mfb .guest{min-height:0}
.mfb .guest .what{font-family:var(--heading);font-weight:var(--fw-medium);font-size:var(--fs-body);color:var(--fg-muted);margin:0 0 26px;line-height:var(--lh-heading)}
.mfb .guest .img{margin-top:auto}
@media (max-width:991.98px){.mfb .g12{grid-template-columns:1fr;row-gap:28px}.mfb .c1-8,.mfb .c1-7,.mfb .c9-12{grid-column:auto}.mfb .g12 .lede{margin-top:0!important}}

/* v2.14: the whole Five Books header is the play control; the mark stays as the cue */
.mfb #fbHero{cursor:pointer}
.mfb #fbHero:focus-visible{outline:2px solid var(--black);outline-offset:2px}
.mfb #fbHero .play{transition:transform var(--dur-overlay) ease-in-out}
.mfb #fbHero:hover .play,.mfb #fbHero:focus-visible .play{transform:scale(1.12);transform-origin:bottom right}

/* v2.15: linked hero keeps white type on hover (theme a:hover black is unreadable on the frame); the name underlines in white */
.mfb a.hero.shade,.mfb a.hero.shade:hover,.mfb a.hero.shade:focus-visible{color:var(--white)}
.mfb a.hero.shade .name,.mfb a.hero.shade .sub{color:var(--white);transition:color var(--dur-overlay) ease-in-out}
.mfb a.hero.shade:hover .name,.mfb a.hero.shade:focus-visible .name{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.12em;text-decoration-color:var(--white)}
.mfb a.hero.shade:hover .sub,.mfb a.hero.shade:focus-visible .sub{color:#d9d9d9}

/* v2.17: guest cards. No underline or colour change on hover; the cue is a short muted loop fading in over the still */
.mfb a.guest,.mfb a.guest:hover,.mfb a.guest:focus-visible{text-decoration:none;color:var(--fg)}
.mfb a.guest:hover .who,.mfb a.guest:hover .num,.mfb a.guest:focus-visible .who,.mfb a.guest:focus-visible .num{color:var(--fg)}
.mfb a.guest:hover .what,.mfb a.guest:focus-visible .what{color:var(--fg-muted)}
.mfb a.guest:focus-visible{outline:2px solid var(--black);outline-offset:4px}
.mfb .guest .img{position:relative;overflow:hidden}
.mfb .guest .img video.preview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity var(--dur-fill,400ms) linear;pointer-events:none}
.mfb .guest.is-previewing .img video.preview{opacity:1}
@media (prefers-reduced-motion:reduce){.mfb .guest .img video.preview{display:none}}

/* v3.0: guest cards carry number + name only */
.mfb .guest .who{margin-bottom:26px}

/* v3.1: covers in the books list (the editions Adam shows on camera). Third column on the same gutter; hairline, no radius, no shadow */
.mfb .books li{grid-template-columns:120px 110px 1fr;gap:30px;align-items:start}
.mfb .books .n{margin-top:-6px}
.mfb .books .cover{display:block;width:110px;height:auto;outline:1px solid var(--surface-tab);outline-offset:-1px}
.mfb .books li .t{margin-top:2px}
@media (max-width:640px){.mfb .books li{grid-template-columns:48px 84px 1fr;gap:14px}.mfb .books .cover{width:84px}}

/* v3.3: guest grid per Mark's list. Bio fragment under the name, in his site's words; the still is the class video's own frame */
.mfb .guest .who{margin-bottom:8px}
.mfb .guest .bio{font-size:var(--fs-body-sm);color:var(--fg-muted);margin:0 0 22px;line-height:1.4}

/* v3.4: the books named in each part, under the standfirst */
.mfb .film .shelf{list-style:none;margin:18px 0 0;padding:14px 0 0;border-top:1px solid var(--surface-tab);font-size:var(--fs-body-sm);line-height:1.45;max-width:60ch}
.mfb .film .shelf li{margin:0 0 4px;padding-left:14px;text-indent:-14px}
.mfb .film .shelf li::before{content:"";display:inline-block;width:6px;height:1px;background:var(--black);vertical-align:middle;margin-right:8px}

/* v3.5: guest cards are name + picture only */
.mfb .guest .who{margin-bottom:26px}

/* v3.5 · index v2 for comparison: no numbers, names in display type */
.mfb .guests.v2 .num{display:none}
.mfb .guests.v2 .guest{padding-top:18px}
.mfb .guests.v2 .who{font-family:var(--display);font-weight:var(--fw-semibold);font-size:var(--fs-display-md);line-height:1;text-transform:uppercase;margin:0 0 22px;letter-spacing:0}

/* ===== plugin layer: base type on the root (the comp's body rule), Vimeo embeds, pending states ===== */
.mfb{font-family:var(--sans);font-weight:var(--fw-regular);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--fg);background:var(--white)}
.mfb .mfb-embed{position:relative;aspect-ratio:16/9;background:#000}
.mfb .mfb-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.mfb .mfb-note{font-size:var(--fs-meta);color:var(--fg-muted);margin-top:8px}
.mfb #fbHero.is-pending{cursor:default}
.mfb #fbHero.is-pending .play{opacity:.5}

/* ===== 0.2.0 · sub-brand (design handoff 2026-10-28). Mark, name line, strip, chip, position marks, landing feature ===== */
.mfb-mark{display:block;flex:0 0 auto;width:29px;height:24px;fill:currentColor;overflow:visible}
.mfb-mark--lg{width:58px;height:48px}
.mfb-name{font-family:'Work Sans',sans-serif;font-weight:500;font-size:13px;line-height:1.2;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.mfb-name .mfb-dot{display:inline-block;margin:0 .55em}
/* Strip: full width directly under the site header. Mark's left edge sits on the header column (the badge's top-left corner). */
.mfb .mfb-strip{--mfb-fg:#000;--mfb-bg:#f2f3f2;background:var(--mfb-bg);color:var(--mfb-fg)}
.mfb .mfb-strip .container-fluid{padding-left:15px;padding-right:15px}
.mfb .mfb-strip-inner{display:flex;align-items:center;gap:14px;padding:50px 1rem 10px .3125rem;color:inherit;text-decoration:none} /* mark left = badge bounding left (navbar-brand padding .3125rem). The badge tail hangs 40px below the 114px header, so the row starts 50px down: under the tail tip, as in the handoff mock where the tail ends inside the header */
.mfb .mfb-strip-inner:hover,.mfb .mfb-strip-inner:focus-visible{color:#000;text-decoration:none}
@media (max-width:767.98px){.mfb .mfb-strip-inner{padding:50px 0 10px}.mfb .mfb-strip .mfb-name{font-size:11px;letter-spacing:.1em}}
/* Chip */
.mfb .mfb-chip{--mfb-fg:#000;--mfb-bg:#f2f3f2;display:inline-flex;align-items:center;gap:10px;padding:7px 12px;color:var(--mfb-fg);background:var(--mfb-bg);margin-bottom:18px}
.mfb .mfb-chip .mfb-name{font-size:12px}
/* Books list v2 (3a): position mark, number, cover, text */
.mfb .books-head{margin-bottom:8px}
.mfb .books-title{font-family:var(--display);font-weight:var(--fw-semibold);font-size:48px;line-height:1;margin:0 0 22px;text-transform:none}
.mfb .books-head .separator{width:150px;border-top:2px solid var(--black);margin:0}
.mfb .books-v2 li{grid-template-columns:80px 96px 1fr;gap:28px;padding:22px 0;align-items:start;border-top:1px solid var(--black)}
.mfb .books-v2 li:last-child{border-bottom:1px solid var(--black)}
.mfb .books-v2 .pos{display:flex;flex-direction:column;gap:8px;margin:0}
.mfb .mfb-mark--pos{width:44px;height:36px}
.mfb .mfb-mark--pos .on{fill:#000}.mfb .mfb-mark--pos .off{fill:#d4d4d4}
.mfb .books-v2 .num{font-family:var(--display);font-weight:var(--fw-semibold);font-size:22px;line-height:1;margin:0}
.mfb .books-v2 .cover{width:96px;height:140px;object-fit:cover;outline:0;display:block}
.mfb .books-v2 .t{font-family:var(--display);font-weight:var(--fw-medium);font-size:30px;line-height:1.05;margin:0 0 6px;font-style:normal}
.mfb .books-v2 .a{font-family:var(--sans);font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 10px;color:var(--fg)}
.mfb .books-v2 .why{font-size:16px;line-height:1.4;color:var(--fg);max-width:560px;margin:0}
@media (max-width:640px){.mfb .books-v2 li{grid-template-columns:56px 72px 1fr;gap:14px}.mfb .mfb-mark--pos{width:32px;height:26px}.mfb .books-v2 .cover{width:72px;height:105px}.mfb .books-v2 .t{font-size:24px}}
/* Landing feature (3e): gradient + cut-out left, chip/eyebrow/name/blurb/button right */
.mfb .feature{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:center}
.mfb .feature-art{position:relative;display:block;overflow:hidden;background:#000 center/cover no-repeat;aspect-ratio:16/9}
.mfb .feature-copy{padding:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.mfb .feature-copy .eyebrow{margin:0}
.mfb .feature-copy .separator{width:150px;border-top:2px solid var(--black);margin:6px 0 16px}
.mfb .feature-name{font-family:var(--display);font-weight:var(--fw-semibold);font-size:48px;line-height:1;margin:0 0 16px;text-transform:none}
.mfb .feature-blurb{font-size:16px;line-height:1.4;max-width:400px;margin:0 0 24px}
@media (max-width:767.98px){.mfb .feature{grid-template-columns:1fr;gap:24px}}

/* Social demo (temporary review page) */
.mfb .demo-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:48px;align-items:start}
.mfb .demo-grid .eyebrow{display:block;margin-bottom:12px}
.mfb .mfb-embed--tall{aspect-ratio:9/16}
@media (max-width:991.98px){.mfb .demo-grid{grid-template-columns:1fr}.mfb .demo-tall{max-width:360px}}