@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@300;500;700;800&display=swap');

:root {
  --mf-yellow: #e7c900;
  --mf-paper: #f1f1ec;
  --mf-pad: clamp(20px, 3vw, 52px);
}

body.menu-open { overflow: hidden; }
.mf-home-header { position: fixed; z-index: 1000; inset: 0 0 auto; height: 82px; padding: 16px var(--mf-pad); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; color: #fff; font-family: "Archivo", Arial, sans-serif; }
.mf-home-brand { position: relative; z-index: 2; width: 52px; }
.mf-home-brand img { display: block; width: 52px; height: 58px; object-fit: contain; object-position: left center; }
.mf-home-meta { display: flex; gap: 34px; font-size: 11px; letter-spacing: .12em; }
.mf-home-toggle { position: relative; z-index: 2; justify-self: end; display: flex; gap: 9px; align-items: center; padding: 10px 0; border: 0; background: transparent; color: inherit; font: 700 12px/1 "Archivo", Arial, sans-serif; letter-spacing: .12em; cursor: pointer; }
.mf-home-toggle i { font-size: 18px; font-style: normal; }
.mf-home-menu { position: fixed; z-index: 1; inset: 0; display: flex; flex-direction: column; padding: 24px var(--mf-pad) 30px; background: #111; color: var(--mf-paper); transform: translateY(-102%); transition: transform .65s cubic-bezier(.77, 0, .18, 1), visibility 0s .65s; visibility: hidden; }
.menu-open .mf-home-menu { transform: none; visibility: visible; transition-delay: 0s; }
.mf-home-menu-top, .mf-home-menu-foot { display: flex; justify-content: space-between; font-size: 11px; letter-spacing: .12em; }
.mf-home-menu-close { border: 0; background: transparent; color: inherit; cursor: pointer; }
.mf-home-menu-links { margin: auto 0; }
.mf-home-menu-links a { display: flex; align-items: flex-start; padding: 13px 0; border-bottom: 1px solid #333; color: inherit; text-decoration: none; line-height: .8; transition: color .2s; }
.mf-home-menu-links a:first-child { border-top: 1px solid #333; }
.mf-home-menu-links a:hover, .mf-home-menu-links a:focus-visible, .mf-home-menu-links a[aria-current] { color: var(--mf-yellow); }
.mf-home-menu-links small { width: 6%; font-size: 10px; }
.mf-home-menu-links span { font-size: clamp(48px, 7.5vw, 120px); font-weight: 700; letter-spacing: 0; }
.mf-home-menu-foot > div { display: flex; gap: 25px; }
.mf-home-menu-foot a { color: inherit; text-decoration: none; }
.mf-home-menu-foot a:hover { color: var(--mf-yellow); }
.mf-home-hero { position: relative; width: 100%; height: 100svh; min-height: 590px; overflow: hidden; background: #171717; color: #fff; font-family: "Archivo", Arial, sans-serif; }
.mf-home-hero > video { position: absolute; inset: 0; width: 100%; max-width: none; height: 100%; object-fit: cover; }
.mf-home-hero-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.04) 45%, rgba(0,0,0,.72)); }
.mf-home-hero-copy { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 110px var(--mf-pad) 27px; }
.mf-home-eyebrow { display: flex; justify-content: space-between; padding-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,.3); font-size: 11px; letter-spacing: .14em; }
.mf-home-hero h1 { margin: 28px 0 clamp(28px,3vw,44px); font-size: clamp(55px, 9.2vw, 158px); font-weight: 700; line-height: .82; letter-spacing: 0; }
.mf-home-hero h1 span { display: block; }
.mf-home-hero h1 span:last-child { text-align: right; }
.mf-home-hero h1 em { color: var(--mf-yellow); font-weight: 300; font-style: italic; }
.mf-home-hero-bottom { display: grid; grid-template-columns: minmax(180px,1fr) auto minmax(180px,1fr); gap: 24px; align-items: end; font-size: 12px; letter-spacing: .08em; }
.mf-home-hero-bottom p { max-width: 250px; margin: 0; line-height: 1.4; }
.mf-home-explore { padding-bottom: 7px; border-bottom: 1px solid; color: inherit; text-decoration: none; }
.mf-home-reel { justify-self: end; padding: 0; border: 0; background: transparent; color: inherit; font-size: 12px; white-space: nowrap; cursor: pointer; }
.mf-home-reel span { margin-left: 18px; color: #ccc; }
.mf-home-manifesto { position: relative; padding: clamp(90px, 10vw, 170px) var(--mf-pad); overflow: hidden; background: #090909; color: var(--mf-paper); font-family: "Archivo", Arial, sans-serif; }
.mf-home-manifesto-label { display: grid; grid-template-columns: 80px 1fr auto; gap: 20px; padding-top: 13px; border-top: 1px solid #454545; font-size: 10px; letter-spacing: .14em; }
.mf-home-manifesto h2 { position: relative; z-index: 2; margin: clamp(68px, 8vw, 125px) 0 clamp(52px, 6vw, 92px); font-size: clamp(58px, 10vw, 164px); font-weight: 700; line-height: .82; letter-spacing: 0; }
.mf-home-manifesto h2 > span { display: block; }
.mf-home-manifesto h2 > span:first-child { color: var(--mf-yellow); }
.mf-home-manifesto h2 > span:last-child { margin-left: 16%; }
.mf-home-manifesto-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, .72fr); gap: clamp(44px, 8vw, 140px); align-items: end; }
.mf-home-manifesto-image { position: relative; min-height: 640px; max-height: 900px; height: 72vw; margin: 0; overflow: hidden; background: #191513; }
.mf-home-manifesto-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; filter: saturate(.9) contrast(1.04); transition: transform 1.1s cubic-bezier(.2,.7,.2,1); }
.mf-home-manifesto-image:hover img { transform: scale(1.025); }
.mf-home-manifesto-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 65%, rgba(0,0,0,.72)); pointer-events: none; }
.mf-home-manifesto-image figcaption { position: absolute; z-index: 1; inset: auto 24px 20px; display: flex; justify-content: space-between; color: #fff; font-size: 10px; letter-spacing: .13em; }
.mf-home-manifesto-copy { padding-bottom: clamp(0px, 3vw, 42px); }
.mf-home-manifesto-copy p { margin: 0; }
.mf-home-manifesto-lead { font-size: clamp(27px, 2.4vw, 42px); font-weight: 500; line-height: 1.16; }
.mf-home-manifesto-lead em { color: var(--mf-yellow); font-weight: 300; font-style: normal; }
.mf-home-manifesto-copy > p:nth-child(2) { margin-top: clamp(35px, 4vw, 65px); color: #bdbdb8; font-size: clamp(16px, 1.25vw, 20px); line-height: 1.55; }
.mf-home-manifesto-copy > a { display: flex; justify-content: space-between; margin-top: clamp(45px, 5vw, 75px); padding: 14px 0; border-top: 1px solid #777; border-bottom: 1px solid #777; color: inherit; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-decoration: none; transition: color .2s, border-color .2s; }
.mf-home-manifesto-copy > a:hover { color: var(--mf-yellow); border-color: var(--mf-yellow); }
.mf-home-work { position: relative; padding: clamp(58px, 6vw, 90px) clamp(8px, 1vw, 16px); overflow: hidden; background: #e9e9e4; color: #090909; font-family: "Archivo", Arial, sans-serif; }
.mf-home-work-header { display: grid; grid-template-columns: 1fr 3fr auto; gap: 24px; align-items: end; margin-bottom: clamp(38px, 4vw, 64px); }
.mf-home-work-header > div { align-self: start; display: grid; grid-template-columns: 55px 1fr; padding-top: 12px; border-top: 1px solid #111; font-size: 10px; letter-spacing: .13em; }
.mf-home-work-header h2 { margin: 0; font-size: clamp(53px, 8.6vw, 142px); font-weight: 700; line-height: .82; letter-spacing: 0; }
.mf-home-work-header h2 em { color: #817f78; font-weight: 300; font-style: italic; }
.mf-home-work-header > p { margin: 0; font-size: 11px; line-height: 1.5; letter-spacing: .1em; text-transform: uppercase; }
.mf-home-work-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-flow: dense; gap: 0; background: #181818; }
.mf-home-work-item, .mf-home-work-item:nth-child(n) { --work-y: 0px; position: relative; display: block; grid-column: span 1; min-height: 260px; aspect-ratio: 4 / 5; overflow: hidden; clip-path: inset(5%); background: #181818; color: #fff; text-decoration: none; isolation: isolate; transition: clip-path .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); }
.mf-home-work-item.is-visible { clip-path: inset(0); }
.mf-home-work-media { position: absolute; inset: -5%; z-index: -2; }
.mf-home-work-media img { width: 100%; height: 112%; object-fit: cover; transform: translate3d(0, var(--work-y), 0) scale(1.06); transition: filter .6s, transform .25s linear; will-change: transform; }
.mf-home-work-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0,0,0,.18), transparent 45%, rgba(0,0,0,.7)); transition: background .5s; }
.mf-home-work-no { position: absolute; top: clamp(22px, 3vw, 44px); left: clamp(22px, 3vw, 44px); font-size: 10px; letter-spacing: .13em; }
.mf-home-work-title { position: absolute; right: clamp(18px, 2vw, 32px); bottom: clamp(20px, 2vw, 32px); left: clamp(18px, 2vw, 32px); overflow: hidden; }
.mf-home-work-title small { display: block; margin-bottom: 14px; font-size: 10px; letter-spacing: .14em; transform: translateY(18px); opacity: 0; transition: transform .65s .12s, opacity .65s .12s; }
.mf-home-work-title h3 { max-width: 95%; margin: 0; color: #fff; font-size: clamp(28px, 3.5vw, 58px); font-weight: 700; line-height: .94; letter-spacing: 0; transform: translateY(110%); transition: transform .9s cubic-bezier(.16,1,.3,1); }
.mf-home-work-item.is-visible .mf-home-work-title h3, .mf-home-work-item.is-visible .mf-home-work-title small { transform: none; opacity: 1; }
.mf-home-work-arrow { position: absolute; top: clamp(20px, 3vw, 40px); right: clamp(22px, 3vw, 44px); font-size: clamp(24px, 3vw, 45px); transition: transform .35s; }
.mf-home-work-item:hover .mf-home-work-media img { filter: saturate(1.15) contrast(1.05); transform: translate3d(0, var(--work-y), 0) scale(1.1); }
.mf-home-work-item:hover .mf-home-work-shade { background: linear-gradient(180deg, rgba(0,0,0,.1), transparent 50%, rgba(0,0,0,.55)); }
.mf-home-work-item:hover .mf-home-work-arrow { transform: translate(5px, -5px); }
.mf-home-work-cursor { position: fixed; z-index: 1100; top: 0; left: 0; display: grid; width: 74px; height: 74px; place-items: center; border-radius: 50%; background: var(--mf-yellow); color: #080808; font-size: 10px; font-weight: 700; letter-spacing: .1em; pointer-events: none; opacity: 0; transform: translate3d(-50%, -50%, 0) scale(.6); transition: opacity .2s, transform .25s cubic-bezier(.16,1,.3,1); }
.mf-home-work-cursor.is-active { opacity: 1; transform: translate3d(-50%, -50%, 0) scale(1); }
.mf-footer { position: relative; padding: clamp(75px, 8vw, 125px) var(--mf-pad) 26px; overflow: hidden; background: #090909; color: var(--mf-paper); font-family: "Archivo", Arial, sans-serif; }
.mf-footer a { color: inherit; text-decoration: none; }
.mf-footer-intro { display: flex; justify-content: space-between; padding-top: 13px; border-top: 1px solid #444; font-size: 10px; letter-spacing: .14em; }
.mf-footer-cta { display: flex; justify-content: space-between; align-items: center; padding: clamp(55px, 7vw, 110px) 0 clamp(65px, 8vw, 125px); border-bottom: 1px solid #444; transition: color .3s; }
.mf-footer-cta > span { font-size: clamp(54px, 10vw, 165px); font-weight: 700; line-height: .82; letter-spacing: 0; }
.mf-footer-cta i { font-size: clamp(45px, 8vw, 120px); font-weight: 300; font-style: normal; transition: transform .4s cubic-bezier(.16,1,.3,1); }
.mf-footer-cta:hover { color: var(--mf-yellow); }
.mf-footer-cta:hover i { transform: translate(10px, -10px); }
.mf-footer-main { display: grid; grid-template-columns: 1.5fr 1fr .8fr .7fr 1.3fr; gap: clamp(26px, 4vw, 70px); padding: clamp(55px, 6vw, 90px) 0; }
.mf-footer-brand img { width: 64px; height: 74px; object-fit: contain; }
.mf-footer-brand p { max-width: 260px; margin: 28px 0 0; color: #a9a9a4; font-size: 13px; line-height: 1.55; }
.mf-footer-column { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; font-size: 13px; }
.mf-footer-column a { position: relative; padding-bottom: 2px; }
.mf-footer-column a::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: var(--mf-yellow); transform: scaleX(0); transform-origin: right; transition: transform .3s; }
.mf-footer-column a:hover::after { transform: scaleX(1); transform-origin: left; }
.mf-footer-label { display: block; margin-bottom: 15px; color: #777; font-size: 9px; letter-spacing: .14em; }
.mf-footer-address { margin: 0; font-style: normal; }
.mf-footer-address p { margin: 0 0 18px; color: #c1c1bd; font-size: 12px; line-height: 1.55; }
.mf-footer-bottom { display: grid; grid-template-columns: 1fr 1fr auto; gap: 24px; padding-top: 22px; border-top: 1px solid #444; color: #898985; font-size: 9px; letter-spacing: .12em; }
.mf-footer-bottom a { color: var(--mf-paper); }

@media (max-width: 800px) {
  .mf-home-header { height: 68px; grid-template-columns: 1fr 1fr; }
  .mf-home-meta { display: none; }
  .mf-home-brand, .mf-home-brand img { width: 44px; height: 50px; }
  .mf-home-menu-links small { width: 12%; }
  .mf-home-menu-links span { font-size: clamp(42px, 15vw, 70px); }
  .mf-home-menu-foot > span { display: none; }
  .mf-home-menu-foot > div { width: 100%; justify-content: space-between; }
  .mf-home-hero-copy { padding: 90px 20px 22px; }
  .mf-home-eyebrow span:last-child { display: none; }
  .mf-home-hero h1 { margin: 24px 0 34px; font-size: clamp(45px, 15vw, 76px); line-height: .86; }
  .mf-home-hero h1 span:last-child { text-align: left; }
  .mf-home-hero-bottom { grid-template-columns: 1fr; gap: 16px; align-items: start; }
  .mf-home-explore { display: none; }
  .mf-home-reel { justify-self: start; font-size: 10px; }
  .mf-home-manifesto { padding: 85px 20px 100px; }
  .mf-home-manifesto-label { grid-template-columns: 45px 1fr; }
  .mf-home-manifesto-label span:last-child { display: none; }
  .mf-home-manifesto h2 { margin: 62px 0 48px; font-size: clamp(52px, 17vw, 88px); line-height: .86; }
  .mf-home-manifesto h2 > span:last-child { margin-left: 0; }
  .mf-home-manifesto-grid { grid-template-columns: 1fr; gap: 48px; }
  .mf-home-manifesto-image { min-height: 0; height: auto; aspect-ratio: 4 / 5; }
  .mf-home-manifesto-image img { object-position: center 18%; }
  .mf-home-manifesto-image figcaption { inset: auto 16px 15px; }
  .mf-home-manifesto-copy { padding-bottom: 0; }
  .mf-home-work { padding: 58px 8px 70px; }
  .mf-home-work-header { grid-template-columns: 1fr; gap: 48px; margin-bottom: 65px; }
  .mf-home-work-header > div { grid-template-columns: 45px 1fr; }
  .mf-home-work-header h2 { font-size: clamp(50px, 16vw, 82px); line-height: .86; }
  .mf-home-work-header > p { display: none; }
  .mf-home-work-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
  .mf-home-work-item, .mf-home-work-item:nth-child(n) { grid-column: span 1; min-height: 0; aspect-ratio: 4 / 5; clip-path: inset(5%); }
  .mf-home-work-item.is-visible { clip-path: inset(0); }
  .mf-home-work-title h3 { font-size: clamp(22px, 6vw, 34px); }
  .mf-home-work-title small { max-width: 80%; line-height: 1.4; }
  .mf-home-work-cursor { display: none; }
  .mf-footer { padding: 70px 20px 24px; }
  .mf-footer-intro span:last-child { display: none; }
  .mf-footer-cta { padding: 48px 0 65px; }
  .mf-footer-cta > span { font-size: clamp(43px, 13.5vw, 72px); }
  .mf-footer-main { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 24px; padding: 60px 0; }
  .mf-footer-brand, .mf-footer-address { grid-column: 1 / -1; }
  .mf-footer-brand { display: flex; align-items: flex-start; gap: 28px; }
  .mf-footer-brand p { margin: 4px 0 0; }
  .mf-footer-bottom { grid-template-columns: 1fr auto; }
  .mf-footer-bottom span:nth-child(2) { display: none; }
}

@media (max-width: 520px) {
  .mf-home-work-list { grid-template-columns: 1fr; }
  .mf-home-work-item, .mf-home-work-item:nth-child(n) { grid-column: span 1; aspect-ratio: 4 / 5; }
}

@media (prefers-reduced-motion: reduce) {
  .mf-home-menu, .mf-home-work-item, .mf-home-work-media img, .mf-home-work-title h3, .mf-home-work-title small { transition: none; }
  .mf-home-work-item { clip-path: inset(0); }
  .mf-home-work-title h3, .mf-home-work-title small { transform: none; opacity: 1; }
}
