:root{
  --bg:#080a0d;
  --bg2:#101317;
  --panel:#15191e;
  --panel-raised:#1b2026;
  --text:#f2f1ed;
  --muted:#a6abb2;
}
html{background:var(--bg)}
body,button,input,textarea{
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:400;
}
body{background:var(--bg);color:var(--text)}
.site-header,.site-header.is-scrolled,
.services-page .site-header,.about-page .site-header,.contact-page .site-header{
  background:rgba(8,10,13,.90)!important;
}
.desktop-nav a,.footer-links a{font-size:12px;letter-spacing:-.01em}
.eyebrow{font-weight:600;letter-spacing:.24em}


.kinetic-title{
  font-size:clamp(52px,5.75vw,92px);
  line-height:.96;
  letter-spacing:-.052em;
  font-weight:500;
  max-width:11.8ch;
}
.kinetic-title .accent{color:var(--text)}
.kinetic-title .accent:after{width:72px;height:2px;bottom:-15px;background:var(--yellow)}
.hero-lede{max-width:640px;color:#b7bdc5;font-size:clamp(15px,1.08vw,17px);line-height:1.68}
.hero-rail p{color:#8f969f}


.section-heading h2,.bridge h2,.approach h2,.work-intro h2,.insights-heading h2,.oman h2,.contact h2{
  font-size:clamp(42px,4.65vw,72px);
  line-height:.99;
  letter-spacing:-.043em;
  font-weight:500;
}
.service-title h3{font-weight:500;letter-spacing:-.028em}


.services{background:#101317!important}
.approach{background:#15191e!important}
.work{background:#0b0e12!important}
.contact{background:#15191e!important}
.footer{background:#0d1014!important}
.service-panel{background:#11151a}
.eco-layer-detail{background:rgba(16,19,23,.96)}


.services-page{background:#080a0d}
.services-hero{background:radial-gradient(55% 70% at 84% 50%,rgba(220,219,38,.045),transparent 70%),linear-gradient(180deg,#0d1014 0%,#080a0d 100%)}
.services-hero-copy h1{
  font-size:clamp(56px,5.95vw,96px);
  line-height:.95;
  letter-spacing:-.05em;
  font-weight:500;
}
.need-map{background:#101317}
.need-map-heading h2,.service-content h2,.system-copy h2{
  line-height:.98;
  letter-spacing:-.042em;
  font-weight:500;
}
.need-map-heading h2{font-size:clamp(46px,5.2vw,80px)}
.service-content h2{font-size:clamp(46px,4.8vw,74px)}
.system-copy h2{font-size:clamp(46px,5vw,78px)}
.service-detail-section{background:#0b0e12}
.service-detail-section:nth-of-type(even){background:#15191e}
.service-system{background:#101317}
.spectrum-card{background:linear-gradient(180deg,color-mix(in srgb,var(--c) 5%,#15191e),#101317 68%)}
.spectrum-card:hover{background:linear-gradient(180deg,color-mix(in srgb,var(--c) 13%,#1b2026),#101317 72%)}
.need-card:hover{background:color-mix(in srgb,var(--need) 6%,#15191e)}


body.pillar-page{background:#080a0d;color:var(--text)}
.pillar-hero-copy h1{
  font-size:clamp(56px,5.55vw,90px);
  line-height:.93;
  letter-spacing:-.052em;
  font-weight:500;
  max-width:11.5ch;
}
.pillar-hero-lede{font-size:15px;line-height:1.7;color:#aeb4bd}
.pillar-field{background:rgba(16,19,23,.72)}
.pillar-core{background:radial-gradient(circle at 45% 35%,rgba(var(--pillar-accent-rgb),.18),#101317 68%)}
.pillar-node{background:#15191e}
.pillar-node.is-active,.pillar-node:hover,.pillar-node:focus-visible{background:linear-gradient(135deg,rgba(var(--pillar-accent-rgb),.12),#15191e 68%)}
.pillar-statement{background:#101317}
.pillar-capabilities{background:#0b0e12}
.pillar-live{background:#15191e}
.pillar-usecases{background:#0b0e12}
.pillar-process{background:#101317}
.pillar-related{background:#15191e}
.pillar-faq{background:#0b0e12}
.pillar-statement h2,.pillar-section-head h2,.pillar-live-copy h2,.related-copy h2{
  line-height:.98;
  letter-spacing:-.043em;
  font-weight:500;
}
.pillar-statement h2{font-size:clamp(48px,5.45vw,86px)}
.pillar-section-head h2,.pillar-live-copy h2{font-size:clamp(46px,4.85vw,76px)}
.related-copy h2{font-size:clamp(44px,4.55vw,70px)}
.pillar-cap h3,.usecase-card h3,.pillar-process-list h3,.related-link strong{font-weight:500}


.about-page{background:#080a0d}
.about-hero-copy h1{
  font-size:clamp(56px,5.8vw,94px);
  line-height:.94;
  letter-spacing:-.052em;
  font-weight:500;
}
.about-model{background:#101317}
.about-flow{background:#15191e}
.about-principles{background:#101317}
.about-model-head h2,.about-flow-head h2,.about-local-copy h2,.about-principles-head h2{
  font-size:clamp(46px,5vw,78px);
  line-height:.98;
  letter-spacing:-.043em;
  font-weight:500;
}
.about-model-card,.about-principle{background:rgba(27,32,38,.24)}
.about-node{background:rgba(21,25,30,.82)}
.about-node:hover,.about-node.is-active{background:color-mix(in srgb,var(--c) 7%,rgba(21,25,30,.95))}


.contact-page{background:#080a0d}
.contact-hero{background:radial-gradient(52% 70% at 80% 45%,rgba(220,219,38,.045),transparent 70%),linear-gradient(180deg,#101317,#080a0d)}
.contact-hero h1{
  font-size:clamp(56px,5.8vw,94px);
  line-height:.94;
  letter-spacing:-.052em;
  font-weight:500;
}
.brief-section{background:#101317}
.contact-expect{background:#15191e}
.brief-copy h2,.contact-expect-head h2{
  font-size:clamp(46px,4.9vw,76px);
  line-height:.98;
  letter-spacing:-.043em;
  font-weight:500;
}
.contact-expect-card{background:rgba(27,32,38,.24)}
.brief-core{background:#15191e}


body:not(.pillar-page):not(.services-page):not(.about-page):not(.contact-page){background:#080a0d}

@media(max-width:760px){
  .kinetic-title{font-size:clamp(48px,13.2vw,68px);line-height:.98;letter-spacing:-.046em;max-width:9.5ch}
  .section-heading h2,.bridge h2,.approach h2,.work-intro h2,.insights-heading h2,.oman h2,.contact h2{font-size:clamp(40px,11vw,58px);line-height:1}
  .services-hero-copy h1,.pillar-hero-copy h1,.about-hero-copy h1,.contact-hero h1{font-size:clamp(50px,13.2vw,70px);line-height:.97;letter-spacing:-.045em}
  .pillar-statement h2,.pillar-section-head h2,.pillar-live-copy h2,.related-copy h2,.about-model-head h2,.about-flow-head h2,.about-local-copy h2,.about-principles-head h2,.brief-copy h2,.contact-expect-head h2{font-size:clamp(42px,11.5vw,60px);line-height:1}
}



@media (min-width: 761px){
  .hero{justify-content:flex-start}
  .hero-grid{margin-top:clamp(138px,16.2vh,184px);padding-top:0}
}


.services-hero:after{
  content:"";position:absolute;inset:var(--header) 0 0 44%;z-index:0;pointer-events:none;
  background:
    linear-gradient(90deg,#080a0d 0%,rgba(8,10,13,.72) 20%,rgba(8,10,13,.22) 62%,rgba(8,10,13,.66) 100%),
    linear-gradient(0deg,#080a0d 0%,transparent 34%),
    url("assets/ump-showreel-ump.webp") center/cover no-repeat;
  opacity:.48;filter:saturate(.82) contrast(1.03);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 100%);
}
.services-hero-grid,.services-hero-foot{z-index:2}
.service-spectrum{isolation:isolate}


.contact-hero{position:relative;overflow:hidden}
.contact-hero:before{
  content:"";position:absolute;z-index:0;inset:var(--header) 0 0 47%;pointer-events:none;
  background:
    linear-gradient(90deg,#080a0d 0%,rgba(8,10,13,.52) 19%,rgba(8,10,13,.05) 58%,rgba(8,10,13,.30) 100%),
    linear-gradient(0deg,#080a0d 0%,transparent 38%),
    url("assets/ump-contact-muscat-hero.webp") center/cover no-repeat;
  filter:saturate(.88) contrast(1.03);
  opacity:.92;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 16%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 16%,#000 100%);
}
.contact-hero-grid{position:relative;z-index:2}
.brief-orbit{background:radial-gradient(circle at center,rgba(8,10,13,.72),rgba(8,10,13,.18) 44%,transparent 72%);backdrop-filter:blur(1px)}

@media(max-width:1120px){
  .services-hero:after{inset:var(--header) 0 34% 22%;opacity:.34}
  .contact-hero:before{inset:var(--header) 0 0 26%;opacity:.56}
}
@media(max-width:760px){
  .hero-grid{margin-top:0}
  .services-hero:after{inset:var(--header) 0 38% 0;opacity:.25;-webkit-mask-image:linear-gradient(180deg,#000,transparent);mask-image:linear-gradient(180deg,#000,transparent)}
  .contact-hero:before{inset:var(--header) 0 44% 0;opacity:.38;-webkit-mask-image:linear-gradient(180deg,#000,transparent);mask-image:linear-gradient(180deg,#000,transparent)}
}




html{font-kerning:normal;text-rendering:optimizeLegibility}
body{font-synthesis:none;word-spacing:normal}
p,li,input,textarea,label{word-spacing:normal;letter-spacing:normal}


.kinetic-title,
.section-heading h2,.bridge h2,.approach h2,.work-intro h2,.insights-heading h2,.oman h2,.contact h2,
.services-hero-copy h1,.need-map-heading h2,.service-content h2,.system-copy h2,
.pillar-hero-copy h1,.pillar-statement h2,.pillar-section-head h2,.pillar-live-copy h2,.related-copy h2,
.about-hero-copy h1,.about-model-head h2,.about-flow-head h2,.about-local-copy h2,.about-principles-head h2,
.contact-hero h1,.brief-copy h2,
.service-title h3,.pillar-cap h3,.usecase-card h3,.pillar-process-list h3,
.about-model-card h3,.about-principle h3,.system-route strong{
  word-spacing:-.035em;
  text-wrap:balance;
}


.hero-lede,.section-heading>p,.approach-copy>p,.service-detail p,.services-hero-lede,
.service-intro,.capability-list p,.system-copy>p:last-child,.pillar-hero-lede,
.pillar-statement p,.pillar-section-head>p,.pillar-live-copy>p,.about-hero-lede,
.about-model-head>p:last-child,.about-flow-head>p:last-child,.about-local-copy>p,
.contact-hero-lede,.brief-copy>p:not(.eyebrow),.brief-submit p{
  letter-spacing:0;
  word-spacing:0;
  text-wrap:pretty;
}


.eyebrow{letter-spacing:.17em}
.chapter-indicator span,.rail-kicker,.hero-rail p,.hero-foot,.approach-hint,.service-detail li,.service-detail a,
.brief-block>span,.brief-field span,.brief-caption,.pillar-route-tabs button,.system-route div span{
  letter-spacing:.10em;
}


.service-panel.is-active .service-title{bottom:270px}
.service-panel.is-active .service-detail{
  bottom:24px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.14);
}
.service-detail p{margin:0 0 16px;line-height:1.55}
.service-detail ul{margin:0 0 17px;gap:7px}
.service-detail li{line-height:1.25}
.service-title h3{line-height:1.02}


.system-route div{justify-content:flex-end;gap:4px}
.system-route strong{margin:auto 0 2px;line-height:1.12}
.system-route small{line-height:1.45}


.brief-section{padding:120px 0 145px;background:#101317}
.brief-grid{grid-template-columns:minmax(280px,.62fr) minmax(0,1.38fr);gap:6vw}
.brief-form{
  position:relative;
  padding:30px 34px 34px;
  border:1px solid rgba(220,219,38,.28);
  background:
    radial-gradient(circle at 88% 10%,rgba(220,219,38,.055),transparent 30%),
    linear-gradient(180deg,rgba(27,32,38,.72),rgba(15,18,23,.92));
  box-shadow:0 26px 90px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.035);
  overflow:hidden;
}
.brief-form:before{
  content:"PROJECT BRIEF";
  position:absolute;right:22px;top:18px;
  font-size:7px;letter-spacing:.12em;color:rgba(220,219,38,.72);
}
.brief-block{padding:20px 0 25px}
.brief-fields{gap:0 26px}
.brief-field{padding:20px 0}
.brief-field input,.brief-field textarea{color:#f2f1ed}
.brief-field input::placeholder,.brief-field textarea::placeholder{color:#6d747e}
.brief-submit{padding-top:2px}
.brief-submit button{min-height:52px;font-size:9px;letter-spacing:.09em}


.contact-expect{display:none!important}

@media(max-width:1120px){
  .service-panel.is-active .service-title{bottom:285px}
  .brief-grid{grid-template-columns:1fr;gap:54px}
  .brief-form{padding:28px 30px 32px}
}

@media(max-width:760px){
  .kinetic-title,.services-hero-copy h1,.pillar-hero-copy h1,.about-hero-copy h1,.contact-hero h1,
  .section-heading h2,.bridge h2,.approach h2,.work-intro h2,.oman h2,.contact h2,
  .service-content h2,.system-copy h2,.pillar-statement h2,.pillar-section-head h2,.pillar-live-copy h2,
  .about-model-head h2,.about-flow-head h2,.about-local-copy h2,.about-principles-head h2,.brief-copy h2{
    word-spacing:-.02em;
  }
  .eyebrow{letter-spacing:.14em}
  .service-panel.is-active .service-title{bottom:250px}
  .service-panel.is-active .service-detail{bottom:20px;padding-top:13px}
  .service-detail p{font-size:12px;line-height:1.5;margin-bottom:13px}
  .service-detail ul{margin:0 0 14px}
  .brief-section{padding:88px 0 100px}
  .brief-form{padding:24px 20px 26px}
  .brief-form:before{right:18px;top:14px}
}




@media (min-width:761px){
  .service-panel .service-title{
    bottom:28px;
    transition:none;
    min-height:44px;
  }
  .service-panel.is-active .service-title{bottom:28px}
  .service-panel .service-detail{
    bottom:92px;
    max-width:470px;
    opacity:0;
    transform:translateY(14px);
    transition:opacity .28s ease,transform .4s var(--ease);
  }
  .service-panel.is-active .service-detail{
    opacity:1;
    transform:translateY(0);
  }
  .service-panel .service-detail p{margin:0}
  .service-panel .service-detail ul{margin:14px 0 16px}
  .service-panel .service-title h3{min-height:1.08em;display:flex;align-items:flex-end}
}


.service-panel{transition:flex .72s cubic-bezier(.2,.72,.2,1),border-color .35s}
.service-panel.is-active{flex:2.25 1 0}


@media (min-width:761px){
  .about-model-card{
    min-height:420px;
    display:grid;
    grid-template-rows:24px 150px 78px minmax(96px,auto) 24px;
    align-content:stretch;
  }
  .about-model-card>span{grid-row:1}
  .about-model-card h3{
    grid-row:3;
    align-self:end;
    margin:0;
    max-width:9ch;
    min-height:2.05em;
    display:flex;
    align-items:flex-end;
  }
  .about-model-card p{
    grid-row:4;
    margin:14px 0 16px;
    align-self:start;
  }
  .about-model-card a{grid-row:5;align-self:end}
}


.about-local-copy{
  width:min(100%,var(--max));
  max-width:none;
  margin:0 auto;
  padding-left:var(--gutter);
  padding-right:var(--gutter);
}
.about-local-copy h2{max-width:720px}
.about-local-copy>p:not(.eyebrow){max-width:560px}
.about-local-tags{max-width:760px}


.service-title h3,.about-model-card h3,.about-local-copy h2{word-spacing:normal}

@media (max-width:760px){
  .about-local-copy{padding-left:20px;padding-right:20px}
  .about-model-card{min-height:290px}
}



@media (min-width:761px){
  .service-panel .service-title,
  .service-panel.is-active .service-title{
    left:28px;
    right:28px;
    bottom:26px;
    min-height:54px;
    align-items:flex-end;
  }
  .service-panel .service-title h3{
    margin:0;
    min-height:54px;
    display:flex;
    align-items:flex-end;
    line-height:1.02;
  }
  .service-panel .service-detail,
  .service-panel.is-active .service-detail{
    left:28px;
    right:28px;
    bottom:118px;
    max-width:500px;
    padding:18px 0 0;
    border-top:1px solid rgba(255,255,255,.14);
  }
  .service-panel .service-detail p{margin:0;line-height:1.52}
  .service-panel .service-detail ul{margin:15px 0 15px}
  .service-panel .service-detail .service-more{
    display:inline-flex;
    margin:0;
    line-height:1.2;
  }
}


@media (min-width:1121px){
  .need-card{
    min-height:430px;
    display:grid;
    grid-template-rows:44px 84px minmax(172px,1fr) auto;
    align-content:stretch;
    padding:28px 28px 30px;
  }
  .need-card .need-no{grid-row:1;align-self:start}
  .need-card h3{
    grid-row:2;
    margin:0;
    align-self:end;
    min-height:2.05em;
    display:flex;
    align-items:flex-end;
    line-height:1.02;
  }
  .need-card p{
    grid-row:3;
    margin:18px 0 0;
    align-self:start;
    max-width:29ch;
    line-height:1.62;
  }
  .need-card div{
    grid-row:4;
    margin:18px 0 0;
    align-self:end;
    min-height:62px;
    align-content:flex-end;
  }
}

@media (min-width:761px) and (max-width:1120px){
  .need-card{
    min-height:390px;
    display:grid;
    grid-template-rows:42px 76px minmax(142px,1fr) auto;
  }
  .need-card h3{margin:0;align-self:end;min-height:2.05em;display:flex;align-items:flex-end}
  .need-card p{margin:16px 0 0;align-self:start}
  .need-card div{margin:16px 0 0;align-self:end;min-height:54px}
}



.service-contact {
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .65fr);
  align-items: center;
  gap: clamp(40px, 7vw, 120px);
}
.service-contact-copy {
  max-width: 720px;
}
.service-contact-copy .service-contact-cta {
  display: inline-flex;
  width: auto;
  margin-top: 26px;
}
.service-contact-visual {
  position: relative;
  min-height: 360px;
  display: grid;
  place-items: center;
  overflow: hidden;
}
.service-contact-ring {
  position: absolute;
  border: 1px solid rgba(220,219,38,.24);
  border-radius: 50%;
}
.service-contact-ring--1 { width: 250px; height: 250px; }
.service-contact-ring--2 { width: 360px; height: 360px; opacity: .55; }
.service-contact-core {
  width: 92px;
  height: 92px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(220,219,38,.58);
  border-radius: 50%;
  color: var(--ump-yellow, #dcdb26);
  letter-spacing: .12em;
  font-size: .82rem;
}
@media (max-width: 900px) {
  .service-contact { grid-template-columns: 1fr; }
  .service-contact-visual { min-height: 240px; }
  .service-contact-ring--2 { width: 270px; height: 270px; }
  .service-contact-ring--1 { width: 190px; height: 190px; }
}


.tone-marketing{--accent:#ff405e;--c:#ff405e;--need:#ff405e}
.tone-digital{--accent:#3d91ff;--c:#3d91ff;--need:#3d91ff}
.tone-events{--accent:#ff9c3b;--c:#ff9c3b;--need:#ff9c3b}
.tone-print{--accent:#8e5cff;--c:#8e5cff;--need:#8e5cff}
.eco-layer-row--brand{--layer:#ff405e;--rest-y:-33px;--open-y:-192px;--z:4}
.eco-layer-row--digital{--layer:#3d91ff;--rest-y:-11px;--open-y:-64px;--z:3}
.eco-layer-row--experience{--layer:#ff8a3d;--rest-y:11px;--open-y:64px;--z:2}
.eco-layer-row--production{--layer:#8e5cff;--rest-y:33px;--open-y:192px;--z:1}
.contact-form--cta{display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:18px;min-width:0}
.contact-form--cta .submit-btn{text-decoration:none;width:100%;box-sizing:border-box}
.contact-cta-note{margin:0;color:#959daa;line-height:1.65;max-width:44ch}