/* Refined edition — preserves the supplied Marshall Fox visual system. */
:root{--warm-stone:#716355;--text-muted:#716355;--t-caption:.875rem;--t-eyebrow:.75rem;--t-micro:.75rem;--t-body-sm:1rem;--ls-em:-.035em;--section-y:clamp(56px,6.5vw,104px);--band-y:clamp(56px,6vw,88px)}
html{scroll-padding-top:88px;scrollbar-color:#716355 #f3f2ec}
body{min-width:320px}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--rusty-nail);outline-offset:5px}
.mf-on-dark :focus-visible{outline-color:var(--brass)}
main:focus{outline:none}
a{text-underline-offset:.25em}
.mf-site-header{position:sticky;top:0;z-index:30;background:var(--parchment);border-bottom:1px solid var(--divider-soft)}
.mf-header-row{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:76px}
.mf-brand{display:inline-flex;align-items:center;text-decoration:none;min-height:44px;flex-shrink:0}
#mf-primary-nav{display:flex;align-items:center;gap:clamp(20px,2.4vw,36px)}
#mf-primary-nav a{display:flex;align-items:center;min-height:44px;font-family:var(--font-body);font-size:var(--t-caption);font-weight:var(--w-body-medium);letter-spacing:.20em;text-decoration:none;white-space:nowrap}
#mf-primary-nav a[aria-current]{text-decoration:underline;text-decoration-thickness:1px}
.mf-menu-toggle{display:none;min-width:72px;min-height:44px;padding:0 14px;background:var(--brass);color:var(--text-primary);border:1px solid var(--brass);font-size:11px;font-weight:500;letter-spacing:.18em;text-indent:.18em;cursor:pointer}
.mf-skip{position:absolute;left:24px;top:-100px;padding:12px 20px;background:var(--woodland);color:var(--parchment);z-index:100}
.mf-skip:focus{top:8px;color:var(--parchment)}
/* Supporting sections are immediately readable. */
[data-reveal]:not([data-reveal^="hero"]){opacity:1!important;animation:none!important}
[data-em] .mf-em{letter-spacing:-.035em}
[data-screen-label="Non-negotiables"] .mf-display,[data-screen-label="Ways to work together"] .mf-display{font-size:var(--t-section-compact);line-height:1.15}
[data-screen-label="The Work"]{--section-y:clamp(48px,5.5vw,80px)}
.mf-work-button{appearance:none;background:none;border:0;padding:0;text-align:left;display:block;min-width:0;cursor:pointer}
.mf-work-button>span{display:flex}
#mf-work-rail button{appearance:none;background:none;border:0;min-height:44px;text-align:left;font:inherit}
#mf-work-gallery{padding:6px 6px 12px;margin-inline:-6px;scroll-padding-inline:6px}
#mf-work-rail button[aria-pressed="true"]{color:var(--rusty-nail)!important;border-bottom-color:var(--rusty-nail)!important}
#mf-principles li{opacity:1!important;transition:none!important}
#mf-principles li[data-current="true"] .mf-index{color:var(--rusty-nail)}
#mf-principles li[data-current="true"] h3{text-decoration:underline;text-decoration-color:var(--brass);text-decoration-thickness:1px;text-underline-offset:.22em}
#mf-shelf{margin-top:0!important}
[data-arrow-out]{min-width:44px!important;min-height:44px!important}
footer li a{display:inline-flex;align-items:center;min-height:44px;overflow-wrap:anywhere}
footer ul{padding-left:0;list-style:none}
footer .mf-container>div{min-width:0}
footer img,footer svg{max-width:100%}
@media(max-width:1000px){
 [data-mf-tagline]{display:none!important}
 footer .mf-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;row-gap:36px!important}
}
@media(max-width:760px){
 .mf-header-row{min-height:68px;flex-wrap:wrap;gap:0;position:relative}
 .mf-brand [data-mf-tagline]{display:none!important}
 .mf-menu-toggle{display:block}
 #mf-primary-nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0;padding:12px 0 20px}
 #mf-primary-nav[data-open="true"]{display:flex}
 #mf-primary-nav a{min-height:48px;border-top:1px solid var(--stone-line);font-size:var(--t-caption)}
 [data-screen-label="The Work"] .mf-display{font-size:var(--t-section-compact)}
 [data-grid="principles"]{gap:32px!important}
}
@media(max-width:560px){
 :root{--gutter:24px;--section-y:56px;--band-y:56px}
 .mf-brand{max-width:calc(100% - 80px)}
 [data-grid="work"]{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:28px 14px!important}
 #mf-work button>span{flex-direction:column;align-items:flex-start!important;gap:4px!important}
 #mf-work button>span span{font-size:12px!important;letter-spacing:.06em!important}
 [data-hero-figure]{mask-image:linear-gradient(to top,transparent,#000 100px)!important;-webkit-mask-image:linear-gradient(to top,transparent,#000 100px)!important}
 footer .mf-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:28px 20px!important}
 footer .mf-footer-grid>div:first-child,footer .mf-footer-grid>div:last-child{grid-column:1/-1}
 [data-bio-panel] .mf-display{font-size:2rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}[data-line],[data-reveal]{opacity:1!important;animation:none!important}}

/* Original boxed logo composition, retaining two columns on phones. */
#mf-logos{grid-template-columns:repeat(2,minmax(0,1fr))!important}
@media(max-width:560px){
 #mf-logos{gap:12px!important}
 #mf-logos [data-logo-card]{padding:14px!important}
 #mf-logos [data-mark]{white-space:normal!important}
 #mf-logos [data-mark="default"]{overflow-wrap:normal}
}

/* Video stories: a browseable filmstrip, with one player active at a time. */
.mf-video-feed{margin-top:clamp(36px,4vw,56px);min-width:0}
.mf-video-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:24px}
.mf-video-toolbar h3{margin:0;font-family:var(--font-body);font-size:16px;line-height:1.45;font-weight:500}
.mf-video-arrows{display:flex;gap:8px;flex-shrink:0}
.mf-video-arrows button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--stone-line);background:transparent;color:var(--rusty-nail);cursor:pointer;transition:background 180ms,color 180ms}

.mf-video-arrows button:disabled{opacity:.3;cursor:default}
#mf-video-rail{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:4px;padding:6px 4px 24px;margin-inline:-4px;scrollbar-width:thin;scrollbar-color:var(--rusty-nail) var(--stone-line);overscroll-behavior-x:contain}
.mf-video-card{flex:0 0 40%;min-width:0;scroll-snap-align:start;display:grid;grid-template-rows:auto auto 1fr auto}
.mf-video-media{position:relative;aspect-ratio:16/9;background:var(--heavy-metal);overflow:hidden}
.mf-video-play,.mf-video-media iframe{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0}
.mf-video-play{background:transparent;cursor:pointer;color:var(--heavy-metal)}
.mf-video-play img{display:block;width:100%;height:100%;object-fit:cover;transition:filter 180ms}

.mf-video-play-icon{position:absolute;left:20px;bottom:20px;display:grid;place-items:center;width:48px;height:48px;background:var(--parchment)}
.mf-video-play:focus-visible{outline-offset:-4px;outline-color:var(--brass);outline-width:3px}
.mf-video-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;margin-top:8px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--rusty-nail)}
.mf-video-meta button{border:0;border-bottom:1px solid var(--stone-line);background:transparent;min-height:44px;padding:0;letter-spacing:normal;text-transform:none;cursor:pointer}
.mf-video-card h4{font-family:var(--font-display);font-size:var(--t-video-title);font-weight:400;line-height:1.2;letter-spacing:-.025em;margin:0 0 12px;max-width:26ch;text-wrap:balance}
.mf-video-card>a{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14px;color:var(--heavy-metal-soft)}
@media(max-width:760px){.mf-video-card{flex-basis:72%}.mf-video-toolbar{gap:16px}.mf-video-toolbar h3{max-width:22ch}}
@media(max-width:560px){.mf-video-card{flex-basis:88%}#mf-video-rail{gap:16px}.mf-video-play-icon{left:14px;bottom:14px}.mf-video-meta{font-size:11px;letter-spacing:.06em}}
@media(prefers-reduced-motion:reduce){.mf-video-play img,.mf-video-arrows button{transition:none}}

/* A shared responsive type scale; the art-directed hero keeps its existing size. */
:root{
 --t-display:clamp(2.025rem,1.532rem + 2.022vw,3.15rem);
 --t-h2:clamp(1.71rem,1.375rem + 1.375vw,2.475rem);
 --t-h3:clamp(1.215rem,1.057rem + .647vw,1.575rem);
 --t-section-compact:clamp(2rem,1.562rem + 1.798vw,3rem);
 --t-video-title:clamp(1.625rem,1.46rem + .674vw,2rem);
 --t-quote:clamp(1.5rem,1.116rem + 1.573vw,2.375rem);
}
.mf-display,.mf-h2,.mf-h3,h2,h3,h4{text-wrap:balance}
.mf-video-card>a{align-self:end}
/* Shared rows keep every title and action aligned without truncation. */
@supports(grid-template-rows:subgrid){
 #mf-video-rail{display:grid;grid-auto-flow:column;grid-auto-columns:40%;grid-template-rows:auto auto auto auto;column-gap:24px;row-gap:0}
 .mf-video-card{grid-row:span 4;grid-template-rows:subgrid}
 @media(max-width:760px){#mf-video-rail{grid-auto-columns:72%}}
 @media(max-width:560px){#mf-video-rail{grid-auto-columns:88%;column-gap:16px}}
}
/* Press feedback is immediate and independent of existing transform animations. */
button,a,[role="button"]{touch-action:manipulation}
button,[role="button"]{user-select:none;-webkit-user-select:none}
button:not(:disabled):not([aria-disabled="true"]):active,[data-mf-press]:not([aria-disabled="true"]):active{scale:.98}
a:not([data-mf-press]):active{text-decoration:underline;text-decoration-thickness:2px}
@media(prefers-reduced-motion:no-preference){
 button,[data-mf-press]{transition-property:background-color,color,border-color,opacity,scale;transition-duration:180ms,180ms,180ms,180ms,140ms;transition-timing-function:var(--ease-out)}
}
@media(hover:hover) and (pointer:fine){
 .mf-video-arrows button:hover:not(:disabled){background:var(--woodland);color:var(--parchment)}
 .mf-video-play:hover img{filter:brightness(.85)}
 #mf-work-gallery img:hover{filter:saturate(1)!important}
 #mf-work-rail button:hover,[data-arrow-out]:hover{color:var(--heavy-metal)!important}
}

/* Uppercase navigation with room for the About page. */
#mf-primary-nav a,.mf-menu-toggle{text-transform:uppercase}
@media(min-width:761px) and (max-width:1100px){.mf-brand [data-mf-tagline]{display:none!important}}

/* Floating parchment navigation, retaining the existing wordmark and link styling. */
.mf-site-header{
 position:fixed;inset-inline:0;top:16px;width:calc(100% - 48px);max-width:1280px;margin:0 auto;
 border:0;border-radius:999px;background:rgba(243,242,236,.86);
 -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
 box-shadow:0 6px 24px rgba(36,41,31,.10),0 1px 3px rgba(36,41,31,.04);
}
.mf-site-header .mf-header-row{padding-inline:24px!important;min-height:72px;max-width:none!important}
#mf-primary-nav a[href="/contact"]{
 justify-content:center;padding:0 22px;border:0;border-radius:999px;
 background:#e3c794;color:var(--text-primary);text-indent:.20em;
 transition:background-color .2s ease,color .2s ease,box-shadow .2s ease;
}
#mf-primary-nav a[href="/contact"]:hover{background:var(--woodland);color:#fff;box-shadow:0 3px 10px rgba(36,41,31,.10)}
.mf-menu-toggle{border-radius:999px}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.mf-site-header{background:var(--parchment)}}
@media(max-width:900px){
 .mf-site-header{top:12px;width:calc(100% - 24px);margin:0 auto;border-radius:34px}
 .mf-site-header:has(#mf-primary-nav[data-open="true"]){border-radius:28px}
 .mf-site-header .mf-header-row{padding-inline:20px 12px!important;min-height:64px;flex-wrap:wrap;gap:0;position:relative}
 .mf-brand [data-mf-tagline]{display:none!important}
 .mf-menu-toggle{display:block}
 #mf-primary-nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0;padding:8px 8px 16px;max-height:calc(100dvh - 100px);overflow-y:auto}
 #mf-primary-nav[data-open="true"]{display:flex}
 #mf-primary-nav a{min-height:48px;border-top:1px solid var(--stone-line)}
 #mf-primary-nav a[href="/contact"]{margin-top:8px;min-height:44px}
}
@media(prefers-reduced-motion:reduce){#mf-primary-nav a[href="/contact"]{transition:none}}

/* Let the hero artwork extend behind the floating header. */
:root{--mf-header-clearance:104px}
#main-content:not(:has([data-screen-label="Hero"])){padding-top:var(--mf-header-clearance)}
.mf-hero-content{padding-top:calc(var(--mf-header-clearance) + clamp(48px,5vw,88px))!important}
@media(max-width:900px){:root{--mf-header-clearance:88px}}

/* Mobile accordion keeps the top row padded while the links unfold below it. */
.mf-nav-links{display:flex;align-items:center;gap:clamp(20px,2.4vw,36px)}
@media(max-width:900px){
 .mf-site-header .mf-header-row{padding-block:10px!important}
 #mf-primary-nav,#mf-primary-nav[data-open="true"]{
  display:grid;grid-template-rows:0fr;visibility:hidden;overflow:hidden;
  padding:0 8px;max-height:calc(100dvh - 100px);
  transition:grid-template-rows 360ms cubic-bezier(.22,1,.36,1),padding 360ms cubic-bezier(.22,1,.36,1),visibility 0s 360ms;
 }
 #mf-primary-nav[data-open="true"]{
  grid-template-rows:1fr;visibility:visible;padding:8px 8px 6px;
  transition:grid-template-rows 360ms cubic-bezier(.22,1,.36,1),padding 360ms cubic-bezier(.22,1,.36,1),visibility 0s;
 }
 .mf-nav-links{min-height:0;overflow:hidden;display:flex;flex-direction:column;align-items:stretch;gap:0}
 #mf-primary-nav a{justify-content:center;text-align:center;flex-shrink:0;text-indent:.20em}
}
@media(max-width:560px){
 /* Original SVG canvases already carry the intended whitespace. */
 #mf-logos [data-logo-card]{padding:0!important}
}
@media(prefers-reduced-motion:reduce){
 #mf-primary-nav,#mf-primary-nav[data-open="true"]{transition:none}
}

/* Center the mobile hero and bring its opening line closer to the floating nav. */
@media(max-width:760px){
 .mf-hero-content{padding-top:calc(var(--mf-header-clearance) + 24px)!important}
 [data-grid="hero"]>div:first-child,[data-grid="hero"] h1{text-align:center!important}
 [data-reveal="hero-meta"]{margin-inline:auto}
 [data-reveal="hero-tail"]>div{justify-content:center}
}

@media(max-width:760px){
 #mf-logos [data-logo-card]{padding:0!important}
 #mf-logos .mf-client-mark-art{position:absolute;inset:0;width:100%;height:100%}
 #mf-logos .mf-client-mark img{object-fit:cover}
}

/* A more prominent, still understated hero promise. */
.mf-hero-promise{font-size:clamp(24px,2.1vw,32px);line-height:1.35}