@font-face{font-family:'Jodfay Arabic';src:url("/static/fonts/droid-arabic-kufi-regular.9af6cf067289.woff2") format('woff2');font-weight:400 600;font-display:swap}@font-face{font-family:'Jodfay Arabic';src:url("/static/fonts/droid-arabic-kufi-bold.f07864b5ce86.woff2") format('woff2');font-weight:700 900;font-display:swap}

/* Reference component colours use the approved Jodfay palette; layout and media are unchanged. */
em{color:#655a74}
.passage-nav{color:#f5f2fa;text-shadow:0 1px 12px #08031a80}
#passage-menu{background:#e8e0f5}
#passage-menu::backdrop{background:#1c142988}
#passage-menu nav a{border-bottom:1px solid #1c142933}
.loading-note{color:#f5f2fa;background:#1c1429e6}
.visual-stage{color:#f5f2fa;background:#08031a}
.scene-shade{background:linear-gradient(90deg,#08031a45,#00000000 53%),linear-gradient(#00000000 60%,#08031a55)}
.scene-topline{color:#e8e0f5b5}
.signal-dot{box-shadow:0 0 16px #a855f7}
.scene-lead{color:#d8cfe6d9}
.dark{border-color:#1c142955}
.signal-terms{color:#d8cfe6}
.journey-bottom{color:#d8cfe6b3}
.scroll-invite{color:#f5f2fa}
.chapter-nav a[aria-current]{color:#ffffff}
.output-image{background:#1c1429}
.output-badge{color:#f5f2fa;background:#1c1429c7}
.output-image:hover .output-link{background:#d8cfe6}
.passage-enabled .output-image{box-shadow:0 20px 60px #1c142933}
.section-rail{border-bottom:1px solid #1c142935}
.work-meta a{border-bottom:1px solid #1c142940}
.practice{background:#e8e0f5}
.capability{border-top:1px solid #1c14294a}
.capability:last-child{border-bottom:1px solid #1c14294a}
.cap-body>p{color:#b9afca}
.cap-tags span{border:1px solid #1c142940}
.flow-diagram>span{border-bottom:1px solid #1c142935}
.flow-diagram i{background:#7848d8}
.flow-diagram .flow-human{border:1px solid #7848d8}
.cap-aside{color:#655a74}
.working-note{border-top:1px solid #1c142925}
.working-note li{border-bottom:1px solid #1c142920}
.contact-scene{color:#f5f2fa;background:#08031a}
.contact-shade{background:linear-gradient(90deg,#17102770,#00000000 70%),linear-gradient(#00000000 60%,#1c1429e0)}
.contact-copy>p:not(.chapter-label){color:#d8cfe6c9}
.contact-cta{border:1px solid #f5f2fa8c}
.contact-stage footer .copyright{color:#d8cfe6a0}
.passage-static .scene-copy--hero{background:linear-gradient(90deg,#1c1429b3,#1c142920),url("/static/studio-reference-20261106/concept/passage/v30/robot-poster.c3728a57aab4.webp") 50%/cover}
.passage-static .scene-copy--pieces,.passage-static .scene-copy--connection{background:#171027}
.passage-nav.on-paper .nav-contact{border-color:#1c142960}
.passage-enabled .scene-copy--connection{color:#08031a}
.scene-copy--connection .scene-lead{color:#1c1429}
.scene-copy--connection .chapter-label{color:#655a74}
.visual-stage.in-world .journey-bottom{color:#1c1429}
.visual-stage.in-world .chapter-nav a[aria-current],.visual-stage.in-world .scroll-invite{color:#08031a}
.visual-stage.in-world .journey-track{background:#08031a20}
.reel-window{background:#08031a}
.reel-meta{color:#f5f2fa;text-shadow:0 1px 8px #000000}
.reel-toggle{background:#08031a60}
.passage-enabled .reel-window{box-shadow:0 25px 80px #08031a30}
.project-image{background:#d8cfe6}
.project-tag{color:#1c1429;background:#e8e0f5eb}
.project-arrow{color:#ffffff;background:#08031a45}
.project-caption p{color:#655a74}
.project-caption>span{color:#655a74}
#study-dialog::backdrop{background:#171027d9}
.study-description{color:#655a74}
.contact-scene{background:#08031a}
.contact-copy h2 em{color:#b9afca}
.passage-static .contact-stage{background:#08031a}
.practice{background:#e8e0f5}
.passage-static .scene-copy--pieces{background:#171027}
.passage-static .scene-copy--connection{background:#f5f2fa}
.passage-static .scene-copy--connection{background-image:linear-gradient(90deg,#e8e0f5b0,#00000000),url("/static/studio-reference-20261106/concept/passage/robot-world-v29.229aa0c34e20.webp")}
.passage-enabled .visual-stage{background:#08031a}
.passage-enabled .scene-copy--inside{text-shadow:0 2px 25px #08031acc}
.scene-copy--connection{color:#1c1429}
.scene-copy--connection:before{background:linear-gradient(90deg,#e8e0f58c,#00000000 55%)}
@media (orientation:portrait){.scene-copy--connection:before{background:linear-gradient(#00000000 51%,#e8e0f5d9)}}
.scene-shade{background:linear-gradient(90deg,#17102755,#00000000 54%),linear-gradient(#00000000 66%,#08031a55)}
.visual-stage.in-world .journey-bottom,.visual-stage.in-world .chapter-nav a[aria-current],.visual-stage.in-world .scroll-invite{color:#1c1429}
.arrival-explore{color:#1c1429;border-color:#1c142955}
.loading-note{color:#f5f2fa;background:#08031a}
.loading-aperture rect{stroke:#d8cfe6}
.loading-aperture .loading-current{stroke:#c4b5fd}
.loading-count{color:#c4b5fd}
.loading-line:after{background:#a855f7}
.loading-skip{color:#d8cfe6}
.passage-loading .visual-stage{background:#08031a}
.passage-static .scene-copy--hero{background-image:linear-gradient(90deg,#08031a55,#08031a05),url("/static/studio-reference-20261106/variants/concept/portal-v51/portal-desktop.c18b6939f5da.webp")}
@media (width<=760px){.passage-static .scene-copy--hero{background-image:linear-gradient(#08031a05,#08031a55),url("/static/studio-reference-20261106/variants/concept/portal-v51/portal-mobile.71096db6db8e.webp")}
.passage-enabled .scene-copy--connection,.passage-static .scene-copy--connection,.scene-copy--connection .scene-lead,.scene-copy--connection .chapter-label{color:#1c1429}}
@media (width>=761px) and (orientation:portrait){.passage-static .scene-copy--hero{background-image:linear-gradient(#08031a05,#08031a55),url("/static/studio-reference-20261106/variants/concept/portal-v51/portal-tablet.4ebb62733bc4.webp")}}
@media (width<=760px) and (height<=700px) and (orientation:portrait){.passage-static .scene-copy--hero{background-image:linear-gradient(#08031a05,#08031a55),url("/static/studio-reference-20261106/variants/concept/portal-v51/portal-short.df06f56b26bb.webp")}}
@media (orientation:landscape) and (height<=540px){.passage-static .scene-copy--hero{background-image:linear-gradient(90deg,#08031a55,#08031a05),url("/static/studio-reference-20261106/variants/concept/portal-v51/portal-landscape.06fd190667ca.webp")}}
.passage-enabled .scene-copy--inside:before{background:radial-gradient(ellipse at var(--copy-origin,20%) 50%,#08031aa6,transparent 75%)}
.passage-enabled .scene-copy--inside:after{background:linear-gradient(90deg,#08031a85,#00000000 65%)}
.passage-beat{color:#f5f2fa;text-shadow:0 2px 24px #08031a66}
.scene-copy--inside .passage-beat .chapter-label{color:#d8cfe6}
.passage-beat .chapter-label>span{border-right:1px solid #d8cfe660}
.passage-note{color:#d8cfe6}
@media (orientation:portrait){.passage-enabled .scene-copy--inside:before{background:linear-gradient(#00000000,#08031a80 25%,#00000000 65%)}
.passage-enabled .scene-copy--inside:after{background:linear-gradient(#00000000 7%,#08031a99 18%,#08031a85 34%,#00000000 57%)}}
.entry-cover-active .loading-note.entry-loader{color:#e8e0f5}
.entry-loader__mark{color:#f5f2fa}
.entry-loader__mark-base{color:#1c1429}
.entry-loader__mark-fill{color:#d8cfe6}
.entry-loader__wordmark{color:#e8e0f5}
.entry-loader__meta{color:#b9afca}
.entry-loader__progress{color:#d8cfe6}
.entry-loader__percent{color:#b9afca}
.entry-loader__track{background:#e8e0f515}
.entry-loader__track span{background:#7848d8}
.entry-loader__footer{color:#b9afca}
.entry-loader .loading-skip{color:#b9afca;border-bottom:1px solid #b9afca40}
.entry-loader .loading-skip:hover{color:#f5f2fa;border-bottom-color:#e8e0f599}
.entry-loader .loading-skip:focus-visible{outline:1px solid #d8cfe6}
.passage-nav.on-paper{background:#e8e0f5ed}
.passage-nav.on-dark{color:#f5f2fa;background:#08031aed}
.work-heading .work-disclosure{color:#655a74}
.project--wide .project-image{background:#171027}
.project-image .reel-toggle{color:#f5f2fa;background:#08031ab3}
.project-arrow{background:#08031a80}
.project-caption{border-top:1px solid #1c142930}
.project-caption p{color:#655a74}
.practice{color:#e8e0f5}
.practice .section-rail{border-color:#f5f2fa2e}
.practice .section-rail>:last-child{color:#b9afca}
.practice-heading>p>span{color:#b9afca}
.capability,.capability:last-child{border-color:#e8e0f535}
.capability-toggle:hover .cap-title{color:#c4b5fd}
.cap-number{color:#b9afca}
.cap-plus{color:#d8cfe6;border:1px solid #e8e0f54a}
.capability-toggle:hover .cap-plus{color:#ffffff;border-color:#c4b5fd}
.cap-body>p{color:#b9afca}
.cap-tags span{color:#b9afca;border-color:#e8e0f530}
.practice .text-link{color:#e8e0f5;border-color:#d8cfe650}
.flow-diagram{color:#b9afca}
.flow-diagram>span{border-color:#e8e0f526}
.flow-diagram i{background:#a855f7}
.flow-diagram .flow-human{color:#d8cfe6;background:#c4b5fd09;border-color:#c4b5fd}
.cap-aside{color:#c4b5fd}
.working-note{border-color:#e8e0f535}
.working-note>p em{color:#b9afca}
.working-note li{border-top:1px solid #e8e0f52e}
.working-note li span{color:#c4b5fd}
.contact-copy .chapter-label{color:#655a74}
.contact-copy>p:not(.chapter-label){color:#655a74}
.contact-cta{border:1px solid #655a74}
.contact-stage footer{border-color:#1c142940}
.contact-stage footer .copyright{color:#655a74}
.contact-stage footer .footer-brand{color:#b9afca}
@media (width<=760px){.flow-diagram>span{border-bottom:1px solid #e8e0f526}
.flow-diagram .flow-human{border:1px solid #c4b5fd}}
.passage-nav .nav-contact:hover{color:#08031a;background:#ffffff}
.passage-nav .menu-toggle{color:#08031a;background:#ffffff;border-color:#ffffff}
.project-caption{border-color:#1c142930}
.project-tag{background:#f5f2faeb}
.project-arrow,.project-image .reel-toggle{background:#08031ab3}
.flow-diagram .flow-human{background:#c4b5fd08;border-color:#c4b5fd80}
.contact-stage footer{border-color:#655a7430}
.contact-stage footer .footer-brand{color:#b9afca}
.practice-mark__guides{stroke:#b9afca47}
.practice-mark__outline{stroke:#c4b5fd45}
.practice-mark__parts>path:last-child{fill:#a855f7}
.practice-aside>p>span{border-top:1px solid #b9afca33}
.practice.practice-motion .practice-heading h2 .practice-design{color:#c4b5fd18}
.practice-motion .capability{border-top-color:#00000000}
.practice-motion .capability:before{background:#b9afca47}
.practice .cap-tags span{border-color:#b9afca2c}
.practice .cap-body .text-link{border-color:#c4b5fd61}
.cap-study figcaption{border-top:1px solid #b9afca26}
.contact-character:before{background:radial-gradient(at 52% 54%,#c4b5fd66,#00000000 66%)}
.contact-character__word{color:#c4b5fd}
.contact-character__controls button{background:#f5f2fab3;border:1px solid #655a7440}
.reel-screen:after{background:#00000033}
.reel-screen .reel-sheet{background:#000000}
.rhold__play:after{background:linear-gradient(130deg,#ffffff99,#d8cfe625 42%,#ffffff77);border:1px solid #ffffff88}
.rhold__tag{color:#f5f2fab8}
.rhold__fallback{color:#f5f2fa}
.reel-controls .reel-toggle{color:#f5f2fa;background:#08031a70;border:1px solid #f5f2fa65}
.reel-controls a{text-shadow:0 1px 5px #000000}
.reelfull{color:#ffffff;background:#000000}
.reelfull::backdrop{background:#000000}
.reelfull__close{color:#ffffff;background:#08031abb}
.contact-invitation .contact-cta>.contact-cta-arrow{background:#f5f2fa18}
.contact-invitation .contact-cta:is(:hover,:focus-visible) .contact-cta-arrow{background:#f5f2fa30}
@media (width<=760px){.rhold__tag{color:#f5f2fadb}}
.footer-contact>a{border-bottom:1px solid #b9afca4d}
.footer-bottom{border-top:1px solid #b9afca30}
.footer-top-link>span{border:1px solid #b9afca50}
@media (width<=760px){.footer-nav{border-top:1px solid #b9afca30}}
.contact-invitation .contact-cta{background:linear-gradient(135deg,#7848d8,#08031a);border:1px solid #7848d8;box-shadow:inset 0 1px #ffffff18,0 5px 12px #08031a0b}
.contact-invitation .contact-cta>.contact-cta-signal{color:#08031a;background:linear-gradient(145deg,#e8e0f5,#c4b5fd 45%,#7848d8);box-shadow:inset 0 1px #ffffff90,inset 0 -1px #7848d855}
.contact-invitation .contact-cta:is(:hover,:focus-visible){background:linear-gradient(135deg,#a855f7,#7848d8);border-color:#a855f7;box-shadow:inset 0 1px #ffffff25,0 6px 16px #08031a15}
.project-arrow{background:#08031ab3;border-color:#f5f2fa50}
body .project-grid .project-caption,body .work-projects .project-caption,body .project--wide .project-caption{border-top:1px solid #1c142930}
html.passage-static,html.passage-enabled{background:#08031a}
html:has(>body.site-page){background:#08031a}
:is(#passage-menu,.mobile-menu).apri-menu{color:#f5f2fa;background:#08031a}
:is(#passage-menu,.mobile-menu).apri-menu::backdrop{background:#08031a70}
:is(#passage-menu,.mobile-menu).apri-menu .menu-watermark{fill:#171027}
:is(#passage-menu,.mobile-menu).apri-menu :is(.menu-top,.mobile-menu__top){color:#f5f2fa;background:#08031a;box-shadow:0 -24px 0 24px #08031a}
:is(#passage-menu,.mobile-menu).apri-menu .menu-close{color:#f5f2fa}
:is(#passage-menu,.mobile-menu).apri-menu nav a{color:#f5f2fa;border-bottom:1px solid #c4b5fd2c}
:is(#passage-menu,.mobile-menu).apri-menu nav a[aria-current=page]{color:#c4b5fd}
:is(#passage-menu,.mobile-menu).apri-menu nav .menu-index{color:#b9afca}
:is(#passage-menu,.mobile-menu).apri-menu .menu-link-signal{background:#c4b5fd66}
:is(#passage-menu,.mobile-menu).apri-menu :is(.menu-email,.mobile-menu__mail){color:#c4b5fd;border-bottom:1px solid #c4b5fd50}
:is(#passage-menu,.mobile-menu).apri-menu .menu-note{color:#b9afca}
.page-transition{color:#f5f2fa}
.page-transition.is-handoff{background:#08031a}
.page-transition__plasma{background:radial-gradient(at 70% 25%,#7848d8,#171027 45%,#08031a)}
.page-transition__plasma:after{background:radial-gradient(#08031a26,#00000000 65%)}
.route-loading{color:#e8e0f5}
.route-loading__track{background:#b9afca40}
.route-loading__track>i{background:#c4b5fd}
.project-flight>.route-loading,#project-handoff>.route-loading{background:#08031ae8;border:1px solid #f5f2fa26;box-shadow:0 8px 28px #08031a24}
.page-transition__paper{fill:#08031a}
.page-transition__veil{fill:#08031a}
.page-transition__edge{stroke:#c4b5fd}
.page-transition__top{color:#b9afca}
.page-transition__bottom{color:#b9afca}
.page-transition__title{color:#e8e0f5}
.page-transition__mark{stroke:#c4b5fd}
.page-transition__signal{background:#7848d866}
.page-transition__signal i{background:#c4b5fd}
.page-transition{color:#f5f2fa}
.page-transition.is-handoff{background:#08031a}
.page-transition__plasma{background:radial-gradient(ellipse at 70% 25%,#7848d8,#171027 45%,#08031a)}
.page-transition__plasma::after{background:radial-gradient(ellipse at center,#08031a26,transparent 65%)}
.route-loading{color:#e8e0f5}
.route-loading__track{background:#b9afca40}
.route-loading__track>i{background:#c4b5fd}
.project-flight>.route-loading,#project-handoff>.route-loading{border:1px solid #f5f2fa26;background:#08031ae8;box-shadow:0 8px 28px #08031a24}
.page-transition__paper{fill:#08031a}
.page-transition__veil{fill:#08031a}
.page-transition__edge{stroke:#c4b5fd}
.page-transition__top{color:#b9afca}
.page-transition__bottom{color:#b9afca}
.page-transition__title{color:#e8e0f5}
.page-transition__mark{stroke:#c4b5fd}
.page-transition__signal{background:#7848d866}
.page-transition__signal i{background:#c4b5fd}
.loading-indicator{color:#e8e0f5;background:#08031aed;border:1px solid #f5f2fa26}
.loading-indicator>i{background:#b9afca40}
.loading-indicator>i:after{background:#c4b5fd}
.loading-indicator--plain>i{background:#1c142920}
.loading-error{color:#e8e0f5;background:#08031af5;border:1px solid #f5f2fa26}
.loading-error button{border:1px solid #e8e0f570}
:root{--paper:#f5f2fa;--ink:#1c1429;--muted:#655a74;--signal:#b9afca}
html[lang=ar]{font-family:'Jodfay Arabic',Arial,sans-serif}body.jf-reference-home{font-family:inherit;background:var(--paper)}
.brand svg.jf-reference-logo{width:126px;height:58px}.passage-nav{padding:12px 34px}.nav-caption{display:none}.passage-nav>nav{margin-inline-start:auto;margin-inline-end:0}.scene-topline{direction:inherit}
html[dir=rtl] .scene-copy{direction:rtl;text-align:right}html[dir=rtl] .scene-copy h1,html[dir=rtl] .scene-copy h2{letter-spacing:-.025em;line-height:1.55;font-weight:700}html[dir=rtl] .scene-copy--hero h1{font-size:clamp(34px,4.25vw,66px)}html[dir=rtl] .scene-copy .scene-lead{font-size:13px;line-height:2}html[dir=rtl] .chapter-label{letter-spacing:0;font-size:10px}html[dir=rtl] .scene-copy--inside h2{font-size:clamp(45px,6vw,90px)}
html[dir=rtl] .text-link{direction:rtl}.text-link{gap:28px}button,a{touch-action:manipulation}
.entry-loader__mark{visibility:hidden;height:0!important;margin:0!important}.entry-loader__wordmark{height:100px;width:216px;overflow:visible}.entry-loader__identity{gap:25px}.menu-top>span svg{width:140px;height:65px}.practice-mark{width:150px;max-height:160px}.practice-mark image{filter:drop-shadow(0 5px 15px #7848d837)}
.practice{background:#171027;color:#e8e0f5}.practice .section-rail{border-color:#b9afca3d}.practice .practice-design{color:#b9afca}.practice .capability-toggle{color:#d8cfe6}.practice .capability.is-open .capability-toggle{color:#c4b5fd}.practice .cap-plus{background:#b9afca;color:#1c1429}.practice .cap-body{color:#b9afca}.practice .cap-body .text-link{color:#d8cfe6}.practice .cap-tags>span{border-color:#b9afca55;color:#b9afca}.practice .capability{border-color:#b9afca33}.practice .cap-study{color:#b9afca}.practice .process h3{color:#e8e0f5}
html[dir=rtl] .practice-heading h2{font-family:inherit;letter-spacing:-.045em;font-size:clamp(65px,9vw,138px)}html[dir=rtl] .work-heading h2{font-size:clamp(40px,6vw,92px);letter-spacing:-.04em;line-height:1.8}html[dir=rtl] .project-caption h3{font-size:clamp(25px,3.3vw,48px);line-height:1.8;letter-spacing:-.025em}.project-caption p{line-height:2;max-width:750px}.project-grid .project{min-width:0}.project-media img{object-position:top center}.project-grid .project:nth-child(2n+3){margin-top:100px}
.jf-reference-start{padding:75px var(--gutter) 70px}.jf-reference-start__head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin:45px 0 35px}.jf-reference-start h2{font-size:clamp(30px,4vw,58px);font-weight:500;line-height:1.7}.jf-reference-start__head p{max-width:380px;font-size:13px;line-height:2;color:#655a74}
.jf-hero-choices{display:grid;grid-template-columns:1fr 1fr;gap:20px}.jf-project-choice{border:1px solid #b9afca44;border-radius:4px;display:flex;align-items:center;justify-content:space-between;padding:20px;gap:15px;min-height:92px;background:#e8e0f5;color:#1c1429}.jf-project-choice--preview{background:#7848d8;color:#f5f2fa;border-color:#7848d8}.jf-project-choice__head{display:flex;align-items:center;gap:18px}.jf-project-choice__visual{width:38px;height:32px;object-fit:contain;order:-1}.jf-project-choice__kind{display:none}.jf-project-choice h2{font-size:17px;line-height:1.7}.jf-project-choice__action{display:flex;align-items:center;gap:15px;font-size:11px;white-space:nowrap}.jf-project-choice__action svg{width:18px;height:18px}.jf-hero-choices-footer{padding-top:12px;display:flex;justify-content:flex-start}.jf-hero-work-link{font-size:11px;display:flex;gap:22px;align-items:center;min-height:42px}.jf-hero-work-link svg{width:18px;height:18px}.jf-hero-features{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid #b9afca44;margin:35px 0 0}.jf-hero-features li{display:flex;justify-content:center;align-items:center;gap:13px;padding:25px 10px;border-inline-end:1px solid #b9afca44}.jf-hero-features li:last-child{border:0}.jf-hero-features strong{font-family:Geist,Arial,sans-serif;font-size:35px;font-weight:500;color:#7848d8}.jf-hero-features span{font-size:11px}.jf-hero-summary{font-size:10px;line-height:2;text-align:center;padding-top:24px;color:#655a74}
.jf-reference-immersive{padding:50px var(--gutter) 80px}.jf-reference-immersive .jf-immersive-work{background:transparent;border:0;padding:0;color:var(--ink)}.jf-reference-immersive .sj-container{width:100%;max-width:none;padding:0}.jf-reference-immersive .ej-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;border-top:1px solid #b9afca44;padding-top:30px;margin-bottom:35px}.jf-reference-immersive .sj-eyebrow{font-size:11px;color:#7848d8;display:block;margin-bottom:18px}.jf-reference-immersive h2{font-size:clamp(30px,4vw,54px);font-weight:500;line-height:1.7}.jf-reference-immersive .ej-heading p{font-size:12px;line-height:2;max-width:650px;color:#655a74;margin-top:15px}.jf-reference-immersive .ej-text-link{font-size:11px;display:flex;gap:18px;white-space:nowrap}.sj-icon{width:20px;height:20px;display:inline-block;flex-shrink:0}.jf-reference-immersive .jf-immersive-disclosure{color:#655a74}.jf-reference-immersive .jf-immersive-card{border:0;background:transparent;border-radius:0;box-shadow:none;color:var(--ink)}.jf-reference-immersive .jf-immersive-copy{padding:20px 0}.jf-reference-immersive .jf-immersive-copy p{color:#655a74;font-size:11px}.jf-reference-immersive .jf-immersive-copy>span{color:#7848d8}.jf-reference-immersive .jf-immersive-copy h3{font-size:18px;color:#1c1429;font-weight:500}.jf-reference-immersive .jf-immersive-action{color:#7848d8;border-color:#b9afca44}.jf-reference-immersive .jf-immersive-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.jf-reference-partners{padding:75px var(--gutter)}.jf-reference-partners .sj-container{width:100%;max-width:none}.jf-reference-partners h3{font-size:14px;font-weight:500;margin:0 0 30px;color:#655a74}.ej-partner-logos{display:grid;grid-template-columns:repeat(6,1fr);gap:30px;align-items:center}.ej-partner-logo{height:85px;display:flex;align-items:center;justify-content:center;padding:10px}.ej-partner-logo img{object-fit:contain;width:auto;max-width:130px;height:auto;max-height:65px}.ej-partner-name{font-size:11px}
.site-end{background:#08031a}.site-end .footer-brand{padding-inline:var(--gutter);height:auto;min-height:0}.site-end .footer-brand svg{width:min(650px,85vw);height:auto;max-height:300px;opacity:.34;margin-inline:auto}.site-end .footer-top{color:#b9afca}.site-end h2 em{color:#b9afca}.site-end .footer-kicker{color:#b9afca}.jf-reference-legal{padding:20px var(--gutter) 50px;font-size:11px}.tr-registry-cluster{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:center}.tr-registry-owner{grid-column:1/-1;font-size:12px;font-weight:400;color:#b9afca}.tr-registry-cluster>:is(a,div){display:flex;gap:15px;align-items:center;border:1px solid #b9afca33;padding:18px;min-height:105px}.tr-registry-cluster img{width:50px;height:50px;object-fit:contain}.tr-registry-cluster strong{display:block;font-size:11px;font-weight:500;margin-bottom:8px}.tr-commerce-reg__body>span,.tr-business-license__body>span{display:block;font-size:10px;color:#b9afca}.jf-reference-language{margin-top:25px}.jf-language>summary{width:auto!important;min-height:44px!important;padding:8px 12px!important;justify-content:start}.jf-language-name,.jf-language-code,.jf-language-chevron{display:inline!important}.jf-language-panel{position:static;width:100%;margin-top:15px}.jf-language>summary svg{width:20px;height:20px}.site-end .footer-top .footer-intro{direction:inherit}.contact-copy h2{font-family:inherit;letter-spacing:-.04em;line-height:1.6}.contact-copy>p:not(.chapter-label){font-size:14px;line-height:2}.contact-cta-signal{font-size:30px}.contact-character__aside{line-height:1.8;letter-spacing:0;font-size:10px}
@media(max-width:1100px){.jf-reference-immersive .jf-immersive-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:min(82vw,320px)}.tr-registry-cluster{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.passage-nav{padding:12px 20px}.brand svg.jf-reference-logo{width:110px;height:51px}.scene-topline{top:108px}.scene-copy--hero h1{font-size:31px!important}.scene-copy--hero .scene-lead{font-size:12px!important;line-height:1.9!important}.chapter-nav{gap:18px}.chapter-nav a{font-size:9px}.journey-bottom{padding-inline:20px;gap:10px}.journey-bottom>.motion-toggle{font-size:9px}.scene-copy--inside h2{font-size:45px!important}.scene-copy--connection h2{font-size:35px!important}.entry-loader__identity{width:220px}.entry-loader__wordmark{width:200px;height:92px}.jf-reference-start{padding:50px 20px}.jf-reference-start__head{display:block;margin:30px 0}.jf-reference-start h2{font-size:28px}.jf-reference-start__head p{font-size:11px;margin-top:15px}.jf-hero-choices{gap:10px}.jf-project-choice{display:block;padding:13px;min-height:80px}.jf-project-choice h2{font-size:12px}.jf-project-choice__visual{width:25px;height:25px;order:0}.jf-project-choice__head{gap:8px;justify-content:space-between}.jf-project-choice__action{font-size:10px;justify-content:space-between;margin-top:12px;gap:5px}.jf-hero-features li{flex-direction:column;gap:8px;padding:20px 4px}.jf-hero-features strong{font-size:26px}.jf-hero-features span{font-size:8px}.jf-hero-summary{font-size:8px}.jf-reference-immersive{padding:40px 20px 60px}.jf-reference-immersive .ej-heading{display:block}.jf-reference-immersive .ej-heading h2{font-size:31px}.jf-reference-immersive .ej-text-link{margin-top:20px}.jf-reference-partners{padding:50px 20px}.ej-partner-logos{grid-template-columns:repeat(3,1fr);gap:15px}.ej-partner-logo img{max-width:85px;max-height:50px}.ej-partner-logo{height:75px}.project-grid .project:nth-child(2n+3){margin-top:0}html[dir=rtl] .work-heading h2{font-size:51px;line-height:1.7}html[dir=rtl] .practice-heading h2{font-size:64px}html[dir=rtl] .project-caption h3{font-size:27px}.cap-title{font-size:24px}.cap-body p{font-size:13px;line-height:2}.cap-study__label{font-size:9px}.cap-study figcaption{font-size:11px}.tr-registry-cluster{grid-template-columns:1fr}.jf-reference-legal{padding-inline:20px}.site-end .footer-brand svg{max-height:180px}.contact-copy h2{font-size:42px}.contact-copy>p:not(.chapter-label){font-size:12px}.to-top{display:none!important}}

/* Existing Jodfay contact tools, scoped independently from the old page layout. */
/* قفل التمرير أثناء التحميل، فتح القائمة، أو فتح محادثة الجوال. */
html.tr-locked,
html.tr-locked body,
html.jbot-locked,
html.jbot-locked body{
  overflow: hidden;
  overscroll-behavior: none;
}
/* ============================================================================
   22. الأدوات العائمة — شات بوت جودفاي، واتساب، العودة للأعلى
   أنماط أصلية لـV3: نفس بنية DOM المستخدمة في chatbot.js دون تعديله،
   لكن بلغة النظام الجديد بدل نظام styles.css القديم.
   ============================================================================ */
.tr-v3 .jbot{ position: fixed; inset-block-end: 1.5rem; inset-inline-start: 1.5rem; z-index: 60; }
.tr-v3 .jbot-fab{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: 3.5rem;
  block-size: 3.5rem;
  border-radius: var(--tr-r-full);
  background: var(--tr-white);
  color: var(--tr-black);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
  transition: transform var(--tr-dur) var(--tr-ease), background var(--tr-dur) var(--tr-ease);
}
.tr-v3 .jbot-fab:hover{ transform: translateY(-3px); }
.tr-v3 .jbot-fab .jic{ inline-size: 1.5rem; block-size: 1.5rem; }
.tr-v3 .jbot-fab .jic-x{ display: none; }
.tr-v3 .jbot.is-open .jbot-fab .jic-chat{ display: none; }
.tr-v3 .jbot.is-open .jbot-fab .jic-x{ display: block; }
.tr-v3 .jbot-ping{
  position: absolute; inset-block-start: 0.35rem; inset-inline-end: 0.35rem;
  inline-size: 0.5rem; block-size: 0.5rem; border-radius: 50%;
  background: #a855f7;
}
.tr-v3 .jbot.is-open .jbot-ping{ display: none; }
.tr-v3 .jbot-win{
  position: absolute;
  inset-block-end: 4.5rem;
  inset-inline-start: 0;
  display: flex;
  flex-direction: column;
  inline-size: min(23rem, calc(100vw - 3rem));
  max-block-size: min(34rem, calc(100dvh - 8rem));
  overflow: hidden;
  border: 1px solid var(--tr-line-dark);
  border-radius: var(--tr-r-lg);
  background: #08031a;
  color: var(--tr-light-font);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}
.tr-v3 .jbot-win[hidden]{ display: none; }
.tr-v3 .jbot-head{ display: flex; flex: 0 0 auto; align-items: center; gap: 0.75rem; padding: 1rem; border-block-end: 1px solid var(--tr-line-dark); }
.tr-v3 .jbot-ava{ inline-size: 2rem; block-size: 2rem; flex: 0 0 auto; border-radius: 50%; background: rgba(255,255,255,.08); display: grid; place-items: center; overflow: hidden; }
.tr-v3 .jbot-ava img{ inline-size: 65%; block-size: auto; }
.tr-v3 .jbot-id{ display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-inline-size: 0; }
.tr-v3 .jbot-id b{ font-family: var(--tr-display); font-size: 0.95rem; font-weight: 500; letter-spacing: -0.02em; }
.tr-v3 .jbot-live{ display: flex; align-items: center; gap: 0.4rem; font-size: 0.75rem; font-style: normal; opacity: 0.6; }
.tr-v3 .jbot-live em{ inline-size: 6px; block-size: 6px; border-radius: 50%; background: #a855f7; }
.tr-v3 .jbot-x{ inline-size: 1.75rem; block-size: 1.75rem; display: grid; place-items: center; border-radius: 50%; opacity: 0.6; }
.tr-v3 .jbot-x:hover{ opacity: 1; background: rgba(255,255,255,.08); }
.tr-v3 .jbot-x svg{ inline-size: 1rem; block-size: 1rem; }
.tr-v3 .jbot-log{ flex: 1 1 auto; min-block-size: 0; overflow-y: auto; overscroll-behavior: contain; padding: 1rem; display: flex; flex-direction: column; gap: 0.75rem; }
.tr-v3 .jbot-chips{ display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: 0.4rem; padding-inline: 1rem; }
.tr-v3 .jbot-chips:empty{ display: none; }
.tr-v3 .jbot-privacy{ flex: 0 0 auto; padding: 0.75rem 1rem 0; font-size: 0.7rem; line-height: 1.5; opacity: 0.5; }
.tr-v3 .jbot-privacy a{ text-decoration: underline; text-underline-offset: 2px; }
.tr-v3 .jbot-bar{ display: flex; flex: 0 0 auto; align-items: center; gap: 0.5rem; padding: 0.75rem 1rem 1rem; }
.tr-v3 .jbot-input{
  flex: 1 1 auto; min-inline-size: 0;
  padding: 0.6rem 0.9rem;
  font: inherit; font-size: 0.9rem; color: inherit;
  background: rgba(255,255,255,.06);
  border: 1px solid var(--tr-line-dark);
  border-radius: var(--tr-r-full);
}
.tr-v3 .jbot-input:focus{ outline: none; border-color: rgba(255,255,255,.35); }
.tr-v3 .jbot-input::placeholder{ color: rgba(216,216,216,.4); }
.tr-v3 .jbot-send{
  flex: 0 0 auto; inline-size: 2.25rem; block-size: 2.25rem;
  display: grid; place-items: center;
  border-radius: 50%; background: var(--tr-white); color: var(--tr-black);
}
.tr-v3 .jbot-send:disabled, .tr-v3 .jbot-input:disabled{ opacity: 0.45; cursor: not-allowed; }
.tr-v3 .jbot-send svg{ inline-size: 1rem; block-size: 1rem; }
/* في RTL يُقلب رأس سهم الإرسال ليشير لجهة الكتابة */
[dir="rtl"] .tr-v3 .jbot-send svg{ transform: scaleX(-1); }
.tr-v3 .jbot{ inset-block-end: 1rem; inset-inline-start: 1rem; }
/* حالة الإغلاق: يختفي المجسّم وتظهر علامة × */
.tr-v3 .jbot.is-open .tr-fab--bot .tr-fab__face,
.tr-v3 .jbot.is-open .tr-fab--bot .tr-fab__badge{ display: none; }
.tr-v3 .jbot.is-open .tr-fab--bot{
  inline-size: 3rem; block-size: 3rem;
  place-items: center;
  border-radius: var(--tr-r-full);
  background: var(--tr-white);
  color: var(--tr-black);
}
.tr-v3 .jbot.is-open .tr-fab--bot::before{ display: none; }
/* مواضع المجسّمين */
.tr-v3 .jbot-fab{ position: relative; z-index: 1; }
/* المجسّم يحمل صنف .jic ليعمل تبديل الفتح/الإغلاق في chatbot.js،
   لكن قاعدة .jic القديمة تُقيّده بـ1.5rem فينكمش صندوق الزرّ. نحرّره. */
.tr-v3 .jbot-fab .tr-fab__face.jic{ inline-size: auto; block-size: auto; }
.tr-v3 .jbot-fab .tr-fab__badge.jic{ inline-size: 1.6rem; block-size: 1.6rem; }
.tr-v3 .jbot{ inset-block-end: 1rem; inset-inline-start: 1.25rem; }
.tr-v3 .wa-ping, .tr-v3 .jbot-ping{ display: none; }
/* نافذة المحادثة تنفتح فوق المجسّم */
.tr-v3 .jbot-win{ inset-block-end: 6.5rem; }
.tr-v3 .jbot-win{ inset-block-end: 5.4rem; }
/* One glass control. The native details fallback works without JavaScript. */
 #jbot{width:58px;height:58px;inline-size:58px;block-size:58px}
.ej-contact-hub>summary{width:58px;height:58px;border-radius:50%;border:1px solid #b9afca;background:radial-gradient(circle at 22% 12%,#b9afca88,transparent 65%),#171027db;backdrop-filter:blur(16px);color:#ffffff;box-shadow:0 6px 22px #08031a4d;display:flex;align-items:center;justify-content:center;flex-direction:column;cursor:pointer;list-style:none;line-height:1.2;gap:2px}
.ej-contact-hub>summary::-webkit-details-marker{display:none}
.ej-contact-hub>summary>span{font-size:10px}
.ej-contact-hub>summary svg{width:22px;height:22px}
.ej-contact-options{position:absolute;bottom:72px;right:0;width:min(295px,calc(100vw - 32px));background:#1c1429ed;border:1px solid #655a74;padding:8px;box-shadow:0 15px 50px #00000066;backdrop-filter:blur(20px);border-radius:12px}
#jbot .ej-contact-options :is(.tr-fab,.tr-fab--wa){position:static;inset:auto;width:100%;height:auto;inline-size:100%;block-size:auto;min-height:70px;border:0;border-radius:6px;box-shadow:none;background:transparent;display:flex;justify-content:flex-start;align-items:center;padding:10px 14px;gap:14px;transform:none;text-align:right;overflow:visible;backdrop-filter:none}
#jbot .ej-contact-options .tr-fab:hover{background:#7848d8}
#jbot .ej-contact-options .tr-fab__badge{width:28px;height:28px;inline-size:28px;block-size:28px;flex-shrink:0}
#jbot.is-open .ej-contact-options{visibility:hidden;pointer-events:none}
.ej-contact-hub>summary{width:54px;height:54px}
#jbot{width:54px;height:54px;inline-size:54px;block-size:54px}
.ej-whatsapp-fallback{position:fixed;z-index:90;right:16px;bottom:max(18px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:58px;height:58px;background:#171027e8;border:1px solid #b9afca;border-radius:50%;backdrop-filter:blur(16px);font-size:10px;color:#ffffff!important}
.ej-whatsapp-fallback svg{width:22px;height:22px}
.jbot-ava{width:94px;height:auto;background:none;border:0;flex-shrink:0}
.jbot-ava .jf-logo-plate{padding:5px 7px;border-radius:6px}
.jbot-ava .jf-approved-logo{width:80px;height:auto}
.jbot-win{background:var(--jf-paper);border:1px solid var(--jf-line);border-radius:16px;color:var(--jf-ink);color-scheme:light}
.jbot-head{background:var(--jf-night);color:var(--jf-white);border-color:#c4b5fd30}
.jbot-log{background:var(--jf-paper)}
:is(.jbot-bar,.jbot-chips,.jbot-privacy){background:var(--jf-paper);color:var(--jf-muted);border-color:var(--jf-line)}
.jbot-input{color:var(--jf-ink);background:var(--jf-white);border:1px solid #655a74;border-radius:8px;font-size:16px}
.jbot-send{background:var(--jf-purple);color:var(--jf-white);border-radius:8px}
.jbot-ava .jf-logo-plate{padding:0;background:transparent}
#jbot .jbot-win{max-width:calc(100vw - 32px)}.jbot .jf-logo-plate{width:42px}.jbot img{width:auto;height:auto}.jbot .jf-approved-logo{width:42px;height:24px}.jf-reference-home .ej-contact-hub{z-index:100}.jf-reference-home .to-top{display:none}
.entry-loader__identity{width:auto!important;inset:0!important}.menu-toggle{margin-inline-start:auto;margin-inline-end:0}html[dir=rtl] .menu-toggle{margin-right:auto;margin-left:0}
#our-work{scroll-margin-top:95px}.tr-final__accreditations{padding:15px var(--gutter) 50px}.tr-final__accreditations-head{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #b9afca33;padding-top:25px;font-size:11px}.tr-final__accreditations h3{font-size:12px;font-weight:400}.tr-final__badges{display:flex;list-style:none;overflow-x:auto;gap:30px;align-items:center;padding:25px 0}.tr-final__badge{flex:0 0 75px;height:65px;display:grid;place-items:center;background:transparent}.tr-final__badge img{object-fit:contain;width:100%;height:auto;max-height:60px}.tr-final__accreditations{color:#b9afca}
/* Keep the reference's copy on the open side of its three-dimensional scene. */
html[dir=rtl] .scene-copy{direction:ltr;text-align:right;align-items:flex-start}
html[dir=rtl] .scene-copy>:is(h1,h2,p,a,div){direction:rtl;text-align:right}
html[dir=rtl] .scene-copy>:is(h1,h2){width:min(48vw,650px)}
html[dir=rtl] .scene-copy--hero .scene-lead{width:460px;max-width:44vw;line-height:1.9}
html[dir=rtl] .scene-copy--hero h1{font-size:clamp(34px,4.25vw,66px);line-height:1.45}
@media(max-width:760px){html[dir=rtl] .scene-copy>:is(h1,h2){width:100%}html[dir=rtl] .scene-copy--hero .scene-lead{width:100%;max-width:100%;line-height:1.9}.jf-reference-home .journey-bottom .chapter-nav a{display:flex;gap:5px}.jf-reference-home .journey-bottom .chapter-nav a:before{margin:0}}
/* Arabic mirrors the spatial composition while preserving the approved logo. */
html[dir=rtl] #journey-canvas{transform:scaleX(-1)}
html[dir=rtl] .scene-copy{direction:rtl;align-items:flex-start}
html[dir=rtl] .scene-copy--hero .scene-lead{width:560px;max-width:44vw}
@media(max-width:760px){html[dir=rtl] .scene-copy--hero .scene-lead{width:100%;max-width:100%}}
html[dir=rtl] .scene-shade{transform:scaleX(-1)}html[dir=rtl] .scene-copy--hero .scene-lead{font-size:14px;line-height:1.95}
@media(max-width:760px){html[dir=rtl] .scene-copy--hero .scene-lead{font-size:12px}}
.jf-reference-home #jbot{position:fixed;inset:auto 20px 20px auto;width:54px;height:54px;z-index:100}.jf-reference-home.jf-within-journey #jbot{display:none}.jf-reference-home #jbot .jbot-win{position:absolute;inset:auto 0 76px auto;width:min(380px,calc(100vw - 32px));height:min(560px,75svh)}
#work>.jf-reference-start{padding-inline:0;margin-bottom:50px}
.jf-reference-socials{display:flex;gap:15px;margin-top:25px}.jf-reference-socials a{display:grid;place-items:center;width:26px;height:26px}.jf-reference-socials svg{width:18px;height:18px}.jf-reference-apps{display:flex;gap:22px;font-size:11px;margin-top:25px}
:root{--brand-paper:#f5f2fa;--brand-ink:#1c1429;--brand-dark:#171027;--brand-surface:#e8e0f5;--brand-muted:#655a74;--brand-secondary:#655a74;--brand-olive:#655a74;--brand-sage:#c4b5fd;--brand-brass:#7848d8;--brand-light-muted:#b9afca}
html[lang=ar]{--brand-font:'Jodfay Arabic',Arial,sans-serif}
.practice.practice-motion .practice-heading h2 .practice-design{color:#c4b5fd18;-webkit-text-stroke:.8px rgb(196 181 253/var(--design-outline,.55))}
.contact-copy h2 em{color:#7848d8}.contact-character__word{color:#b9afca}.contact-cta{background:#7848d8}.contact-cta-signal{background:#c4b5fd}
.jf-reference-language-open{display:grid;place-items:center;color:inherit;background:none;border:0;padding:8px;margin:0;width:36px;height:36px;flex:none}.jf-reference-language-open svg{width:20px;height:20px}@media(max-width:900px){.jf-reference-language-open{display:none}}

/* Approved Jodfay identity: one source for the homepage, navigation and contact controls. */
:root{--jf-night:#08031a;--jf-ink:#1c1429;--jf-purple:#7848d8;--jf-accent:#a855f7;--jf-lavender:#c4b5fd;--jf-paper:#f5f2fa;--jf-white:#fff;--jf-muted:#655a74;--jf-pale:#e8e0f5;--jf-line:#d8cfe6;--jf-panel:#171027;--jf-dim:#b9afca;--paper:var(--jf-paper);--ink:var(--jf-ink);--muted:var(--jf-muted);--signal:var(--jf-accent);--brand-paper:var(--jf-paper);--brand-ink:var(--jf-ink);--brand-dark:var(--jf-night);--brand-surface:var(--jf-pale);--brand-muted:var(--jf-muted);--brand-secondary:var(--jf-muted);--brand-olive:var(--jf-muted);--brand-sage:var(--jf-lavender);--brand-brass:var(--jf-purple);--brand-light-muted:var(--jf-dim);--editorial-dark:var(--jf-night);--editorial-metal:var(--jf-muted);--footer-surface:var(--jf-night)}
.jf-reference-home .scene-topline,.jf-reference-home .journey-bottom{color:var(--jf-lavender)}
.jf-reference-home .scene-lead{color:var(--jf-paper)}
.jf-reference-home .visual-stage.in-world .journey-bottom{color:var(--jf-muted)}
.jf-reference-home .scene-copy--connection .scene-lead,.jf-reference-home .scene-copy--connection .chapter-label{color:var(--jf-ink)}
.jf-reference-home .capability-toggle:hover .cap-title,.jf-reference-home .capability.is-open .cap-title{color:var(--jf-lavender)}
.jf-reference-home .jf-project-choice--preview{background:var(--jf-purple);border-color:var(--jf-purple);color:var(--jf-white)}
.jf-reference-home .contact-invitation .contact-cta{background:var(--jf-purple);border-color:var(--jf-purple);color:var(--jf-white);box-shadow:0 5px 12px #08031a18}
.jf-reference-home .contact-invitation .contact-cta:is(:hover,:focus-visible){background:var(--jf-accent);border-color:var(--jf-accent)}
.jf-reference-home .contact-invitation .contact-cta>.contact-cta-signal{background:var(--jf-lavender);color:var(--jf-night);box-shadow:none}
.jf-reference-home .contact-character:before{background:radial-gradient(at 52% 54%,#c4b5fd66,transparent 66%)}
.jf-reference-home .page-transition__plasma>i{filter:grayscale(1);mix-blend-mode:luminosity;opacity:.5}
.jf-reference-home .page-transition__plasma{background:radial-gradient(ellipse at 70% 25%,var(--jf-purple),var(--jf-panel) 45%,var(--jf-night))}

.jf-reference-home .site-end{--footer-surface:var(--jf-night)}

/* Reduced-motion and loading posters inherit brand colour without filtering text or live canvases. */
html.passage-static body.jf-reference-home .scene-copy--hero{background-color:var(--jf-muted);background-blend-mode:normal,luminosity}
/* The reduced-motion hero uses the same digital product scene as WebGL. */
html.passage-static body.jf-reference-home .scene-copy--hero{
  background-image:url("/static/studio-reference-20261106/digital-hero-desktop-en.67d6fcbb5a50.webp");
  background-blend-mode:normal;
}
html[dir=rtl].passage-static body.jf-reference-home .scene-copy--hero{
  background-image:url("/static/studio-reference-20261106/digital-hero-desktop-ar.7030351b8874.webp");
}
html[dir=ltr] .scene-copy--hero h1{max-width:44vw;text-wrap:balance}
@media(orientation:portrait){
  html.passage-static body.jf-reference-home .scene-copy--hero{
    background-image:url("/static/studio-reference-20261106/digital-hero-mobile-en.5bad1fd2064c.webp");
  }
  html[dir=rtl].passage-static body.jf-reference-home .scene-copy--hero{
    background-image:url("/static/studio-reference-20261106/digital-hero-mobile-ar.840f77b08870.webp");
  }
  html[dir=ltr] .scene-copy--hero h1{max-width:100%}
}
html.passage-static body.jf-reference-home .scene-copy--connection{background-color:var(--jf-lavender);background-blend-mode:luminosity}
.jf-reference-home .contact-character__poster{filter:grayscale(1)}
/* The contact invitation sits on paper within the dark outer scene. */
.jf-reference-home .contact-stage{color:var(--jf-ink)}
.jf-reference-home .contact-copy h2{color:var(--jf-ink)}
.jf-reference-home .contact-copy h2 em{color:var(--jf-purple)}