/* Shared page chrome for inner pages (work, case study, future about/contact): base, top nav, buttons, footer, CTA. */
html,body{margin:0;background:#000;color:#fff;font-family:var(--font-body)}
body{overflow-x:clip}
a{color:var(--rf-white);text-decoration:none}a:hover{color:var(--rf-orange)}
:root{--pad-x:48px;--nav-h:73px}
@media(max-width:820px){:root{--pad-x:20px;--nav-h:63px}}
.wrap{width:min(1600px,calc(100% - 2 * var(--pad-x)));margin:0 auto}
nav{position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:var(--space-8);padding:var(--space-5) var(--pad-x);background:#000;border-bottom:1px solid var(--rf-ink-600)}
nav img{height:32px;width:auto;display:block}
nav ul{display:flex;list-style:none;margin:0;padding:0;gap:var(--space-8)}
nav ul a,.menu-btn{font:var(--fw-bold) var(--fs-caption)/1 var(--font-body);letter-spacing:var(--ls-button);text-transform:uppercase;transition:var(--transition-control)}
nav ul a[aria-current]{color:var(--rf-orange)}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--rf-orange);color:#fff;font:var(--fw-bold) var(--fs-caption)/1 var(--font-body);letter-spacing:var(--ls-button);text-transform:uppercase;padding:13px 22px;border-radius:var(--radius-button,999px);transition:var(--transition-control)}
.btn:hover{background:var(--rf-orange-hover,#FF8038);color:#fff}
.menu-btn{all:unset;display:none;cursor:pointer;padding:12px 0 12px 16px}
.menu{position:fixed;inset:var(--nav-h) 0 0;z-index:19;background:#000;display:none;flex-direction:column;justify-content:center;gap:var(--space-2);padding:0 var(--pad-x)}
.menu a{font:var(--fw-bold) 44px/1.02 var(--font-headline);text-transform:uppercase;letter-spacing:var(--ls-headline)}
.menu .btn{align-self:flex-start;margin-top:var(--space-8);font-size:var(--fs-caption)}
.menu-open .menu{display:flex}
h1,h2,h3,h4,blockquote{color:var(--rf-white)}
.eb{font:var(--type-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--rf-orange)}
.phg{display:inline-flex;align-items:center;font:var(--fw-bold) 10px/1 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.35);padding:5px 8px;border-radius:999px}
.qv{opacity:0;transform:translateY(24px);transition:opacity 1000ms var(--ease-out-expo),transform 1000ms var(--ease-out-expo)}
.qv.in{opacity:1;transform:none}
.static .qv{opacity:1;transform:none;transition:none}
/* media frames */
.md{position:relative;overflow:hidden;border-radius:var(--radius-media);background:var(--rf-ink-900)}
.md>img,.md>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.md>video{opacity:0;transition:opacity var(--dur-base) var(--ease-standard)}.md>video.on{opacity:1}
.md.mkbg,.md.empty{background:#000 url(../assets/patterns/topo-lines-orange.svg) center/180% auto}
.md>img.mk{inset:auto;left:50%;top:50%;width:30%;height:auto;object-fit:contain;transform:translate(-50%,-50%)}
.md .vs{position:absolute;left:10px;bottom:10px;z-index:2;font:var(--fw-bold) 9.5px/1 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:#fff;background:rgba(243,113,33,.85);padding:4px 7px;border-radius:999px;white-space:nowrap}
.jr{display:flex;align-items:flex-start;gap:16px}.jsp{display:block}
@media(max-width:820px){.jr{gap:8px}}
/* closing CTA */
.cta{border-top:1px solid var(--rf-ink-600);padding:clamp(112px,16vh,180px) var(--pad-x);display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-10)}
.cta h2{margin:0;color:var(--rf-white);font:400 min(7.2vw,112px)/.98 var(--font-display);text-transform:uppercase;letter-spacing:.01em;text-wrap:balance;max-width:14ch}
.cta h2 i{font-style:normal;color:var(--rf-orange)}
.cta .btn{font-size:15px;padding:18px 30px;gap:12px}
.cta .btn i{font-style:normal;transition:transform var(--dur-base) var(--ease-out-expo)}.cta .btn:hover i{transform:translateX(5px)}
@media(max-width:820px){nav ul,nav>.btn{display:none}.menu-btn{display:block}nav img{height:26px}
.cta{padding:var(--space-20) var(--pad-x);gap:var(--space-8)}
.cta h2{font-size:10vw}
.cta .btn{align-self:stretch;justify-content:center}
}
footer{border-top:var(--border-thick,4px) solid var(--rf-orange);color:var(--rf-gray-300)}
.ft{max-width:var(--content-max,1280px);margin:0 auto;padding:var(--space-16) var(--pad-x);display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-12)}
.ft img{height:44px;width:auto;display:block;align-self:flex-start}
.ft p{margin:0;font:var(--type-body-sm);max-width:var(--measure-narrow,40ch)}
.ft .lbl{display:block;margin-bottom:var(--space-4);font:var(--type-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--rf-orange)}
.ft .lk{display:block;padding:4px 0;font:var(--type-body-sm);color:var(--rf-gray-300)}.ft .lk:hover{color:var(--rf-orange)}
.ft .hg{color:var(--rf-gray-400)}.ft .hg a{color:var(--rf-white);border-bottom:var(--border-thin,1px) solid var(--rf-orange)}.ft .hg a:hover{color:var(--rf-orange)}
.fb{border-top:1px solid var(--rf-ink-600)}
.fb div{max-width:var(--content-max,1280px);margin:0 auto;padding:var(--space-5) var(--pad-x);display:flex;flex-wrap:wrap;gap:var(--space-4);justify-content:space-between;font:var(--type-caption);color:var(--rf-gray-400);text-transform:uppercase;letter-spacing:var(--ls-eyebrow)}
/* shared closing section (.m6 + .fit headline, sized by shared/rf-close.js) */
.fit{margin:0;color:var(--rf-white);font:400 100px/.92 var(--font-display);text-transform:uppercase;letter-spacing:.01em;white-space:nowrap}
.fit .ln{display:block;width:max-content}.fit i{font-style:normal;color:var(--rf-orange)}
.m6{border-top:1px solid var(--rf-ink-600);min-height:100vh;box-sizing:border-box;padding:clamp(120px,18vh,200px) var(--pad-x);display:flex;flex-direction:column;justify-content:center;gap:var(--space-12)}
.m6 .act{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-6)}
.m6 .btn{font-size:15px;padding:20px 32px;gap:12px}
.m6 .btn i{font-style:normal;transition:transform var(--dur-base) var(--ease-out-expo)}.m6 .btn:hover i{transform:translateX(5px)}
.m6 .bps{font:var(--type-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--rf-white)}
.m6 .loc{margin:0;font:var(--type-body);color:var(--rf-gray-300)}
@media(max-width:820px){.m6{min-height:0;padding:var(--space-24) var(--pad-x);gap:var(--space-10)}.m6 .btn{align-self:stretch;justify-content:center}}
