:root{
  --black:#111314;
  --ink:#1b2628;
  --paper:#f3f3f0;
  --white:#ffffff;
  --orange:#e86717;
  --grey:#a7afb0;
  --line-dark:rgba(255,255,255,.22);
  --line-light:rgba(17,19,20,.16);
  --sans:"Neue Haas Grotesk Text Pro","Neue Haas Grotesk","Helvetica Neue",Helvetica,Arial,sans-serif;
  --serif:"Iowan Old Style","Baskerville","Times New Roman",serif;
  --gutter:clamp(1.25rem,4.4vw,4.5rem);
  --header-h:clamp(4.5rem,7.8vw,5.75rem);
  --ease:cubic-bezier(.2,.72,.1,1);
  --scene-hold:8200ms;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;background:var(--black)}
body{
  min-width:320px;
  font-family:var(--sans);
  font-size:1rem;
  line-height:1.5;
  color:var(--white);
  background:var(--black);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body.home-page{overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
::selection{color:var(--white);background:var(--orange)}
:focus-visible{outline:2px solid var(--orange);outline-offset:4px}
#main{scroll-margin-top:var(--header-h)}
#main:focus{outline:none}

.skip-link{
  position:fixed;
  z-index:9000;
  top:.75rem;
  left:.75rem;
  padding:.7rem 1rem;
  color:var(--black);
  background:var(--white);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.12em;
  text-decoration:none;
  text-transform:uppercase;
  transform:translateY(-180%);
  transition:transform .25s ease;
}
.skip-link:focus{transform:translateY(0)}

.film-grain{
  position:fixed;
  z-index:1300;
  inset:-60%;
  width:220%;
  height:220%;
  pointer-events:none;
  opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
  animation:grainShift 1.25s steps(2) infinite;
}
@keyframes grainShift{
  0%{transform:translate3d(0,0,0)}
  25%{transform:translate3d(-1.5%,1%,0)}
  50%{transform:translate3d(1%,-1.25%,0)}
  75%{transform:translate3d(-.75%,-.75%,0)}
  100%{transform:translate3d(0,0,0)}
}

/* Page change: a full-frame dark gate carried by one orange splice. */
.page-wipe{
  position:fixed;
  z-index:8000;
  inset:0;
  pointer-events:none;
  visibility:hidden;
}
.js .page-wipe{visibility:visible}
.wipe-field{
  position:absolute;
  inset:0;
  background:var(--black);
  transform:translate3d(0,0,0);
}
.page-wipe>img{
  position:absolute;
  z-index:2;
  top:50%;
  left:50%;
  width:clamp(10.5rem,19vw,15rem);
  height:auto;
  opacity:1;
  transform:translate(-50%,-50%);
}
.wipe-splice{
  position:absolute;
  z-index:3;
  top:0;
  bottom:0;
  left:0;
  width:clamp(4px,.55vw,8px);
  background:var(--orange);
  box-shadow:0 0 42px rgba(232,103,23,.48);
}
html.tx-ready:not(.tx-leave) .page-wipe{
  visibility:hidden;
  transition:visibility 0s 1.4s;
}
html.tx-ready:not(.tx-leave) .wipe-field{
  transform:translate3d(101%,0,0);
  transition:transform 1.2s var(--ease) .12s;
}
html.tx-ready:not(.tx-leave) .wipe-splice{
  transform:translate3d(101vw,0,0);
  transition:transform 1.2s var(--ease) .12s;
}
html.tx-ready:not(.tx-leave) .page-wipe>img{
  opacity:0;
  transition:opacity .35s ease .2s;
}
html.tx-leave .page-wipe{visibility:visible;transition:none}
html.tx-leave .wipe-field{
  transform:translate3d(0,0,0);
  transition:transform .95s var(--ease);
}
html.tx-leave .wipe-splice{
  transform:translate3d(0,0,0);
  transition:transform .95s var(--ease);
}
html.tx-leave .page-wipe>img{
  opacity:1;
  transition:opacity .3s ease .42s;
}

.site-head{
  position:fixed;
  z-index:1400;
  top:0;
  right:0;
  left:0;
  height:var(--header-h);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 var(--gutter);
  border-bottom:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg,rgba(10,12,12,.54),rgba(10,12,12,.18));
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.brand{
  display:flex;
  align-items:center;
  min-height:2.75rem;
  width:clamp(9rem,14vw,11.25rem);
  text-decoration:none;
}
.brand img{width:100%;height:auto}
.head-nav{display:flex;align-items:center}
.head-nav a{
  display:flex;
  align-items:center;
  min-height:2.75rem;
  gap:1rem;
  color:var(--white);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.13em;
  text-decoration:none;
  text-transform:uppercase;
}
.head-nav a::before{
  content:"";
  width:2.5rem;
  height:1px;
  background:currentColor;
  transform-origin:right;
  transition:transform .45s var(--ease);
}
.head-nav a:hover::before{transform:scaleX(.45)}
.home-page .head-nav a{font-size:.9rem}
.nav-index{color:var(--orange);font-variant-numeric:tabular-nums}

/* Landing journey */
.journey{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:40rem;
  min-height:max(40rem,100svh);
  overflow:hidden;
  isolation:isolate;
  background:var(--black);
  --px:0px;
  --py:0px;
}
.scene-stack,.scene,.scene-media{
  position:absolute;
  inset:0;
}
.scene-stack{z-index:0;background:var(--black)}
.scene{
  z-index:1;
  opacity:0;
  overflow:hidden;
  clip-path:inset(0 100% 0 0);
}
.scene.is-active,.scene.is-entering{will-change:clip-path,opacity}
.scene-media{
  transform:translate3d(var(--px),var(--py),0);
  transition:transform 1.8s cubic-bezier(.16,1,.3,1);
}
.scene.is-active .scene-media,.scene.is-entering .scene-media{will-change:transform}
.scene img{
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center;
  filter:contrast(1.07) brightness(.83);
  transform:scale(1.065);
  transform-origin:center;
}
.scene.is-active img,.scene.is-entering img{will-change:transform,filter}
.scene:nth-child(1) img{object-position:center 48%}
.scene:nth-child(2) img{object-position:center 54%}
.scene:nth-child(3) img{object-position:center 48%}
.scene:nth-child(4) img{object-position:center 52%}
.scene.is-active{
  z-index:2;
  opacity:1;
  clip-path:inset(0);
}
.scene.is-active img{animation:sceneDrift 10.5s linear forwards}
.scene.is-entering{
  z-index:4;
  opacity:1;
  clip-path:inset(0 100% 0 0);
}
.scene.is-entering img{
  filter:contrast(1.07) brightness(.83) blur(8px);
  transform:scale(1.14);
}
.scene.is-entering.is-revealed{
  clip-path:inset(0);
  transition:clip-path 2.45s var(--ease);
}
.scene.is-entering.is-revealed img{
  filter:contrast(1.07) brightness(.83) blur(0);
  transform:scale(1.075);
  transition:filter 2s ease,transform 2.7s var(--ease);
}
.scene.is-exiting img{
  filter:contrast(1.05) brightness(.58) blur(2px);
  transform:scale(1.15);
  transition:filter 2.2s ease,transform 2.7s ease;
}
@keyframes sceneDrift{
  from{transform:var(--drift-start,scale(1.065))}
  to{transform:scale(1.145)}
}

.scene-shade{
  position:absolute;
  z-index:7;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(10,12,12,.7) 0%,rgba(10,12,12,.16) 56%,rgba(10,12,12,.33) 100%),
    linear-gradient(180deg,rgba(10,12,12,.34) 0%,transparent 28%,transparent 58%,rgba(10,12,12,.78) 100%);
}
.splice{
  position:absolute;
  z-index:9;
  top:0;
  bottom:0;
  left:0;
  width:clamp(3px,.38vw,6px);
  pointer-events:none;
  opacity:0;
  background:var(--orange);
  box-shadow:0 0 34px rgba(232,103,23,.7);
  transform:translate3d(-3vw,0,0);
}
.splice::before{
  content:"";
  position:absolute;
  top:0;
  right:100%;
  bottom:0;
  width:15vw;
  background:linear-gradient(90deg,transparent,rgba(232,103,23,.12));
}
.splice.is-moving{animation:spliceMove 2.45s var(--ease) both}
@keyframes spliceMove{
  0%{opacity:0;transform:translate3d(-3vw,0,0)}
  7%{opacity:1}
  92%{opacity:1}
  100%{opacity:0;transform:translate3d(103vw,0,0)}
}

.hero-copy{
  position:relative;
  z-index:11;
  margin:max(clamp(8rem,18vh,11rem),var(--overlay-clearance,0px)) var(--gutter) 0;
  pointer-events:none;
}
.hero-detail{
  color:rgba(255,255,255,.76);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.17em;
  text-transform:uppercase;
}
.hero-copy h1{
  margin-top:clamp(1.1rem,2.4vh,2rem);
  font-size:inherit;
  font-weight:500;
  line-height:.78;
}
.reveal-line{
  display:block;
  overflow:hidden;
  padding:.05em 0 .12em;
  margin-bottom:-.12em;
}
.reveal-inner{
  display:block;
  font-size:clamp(4rem,10.2vw,9.9rem);
  font-weight:500;
  letter-spacing:-.07em;
  line-height:.86;
  text-transform:uppercase;
  transform:none;
  opacity:1;
}
.js .reveal-inner{transform:translateY(112%);opacity:0}
.reveal-line--serif{
  margin-top:.17em;
  margin-left:clamp(1.4rem,11vw,10.5rem);
  padding-bottom:.17em;
}
.reveal-line--serif .reveal-inner{
  font-family:var(--serif);
  font-size:clamp(3.9rem,8.7vw,8.4rem);
  font-style:italic;
  font-weight:400;
  letter-spacing:-.065em;
  line-height:.84;
  text-transform:none;
}
.orange-stop{color:var(--orange)}
.hero-detail--overlay{
  position:absolute;
  right:calc(var(--gutter) + 12rem);
  left:calc(var(--gutter) + 12rem);
  margin:0;
  font-size:1.125rem;
  text-align:center;
  pointer-events:none;
}
.js .hero-detail,.js .journey-ui{opacity:0;transform:translateY(12px)}
html.tx-ready .reveal-inner{
  opacity:1;
  transform:translateY(0);
  transition:transform 1.15s var(--ease) .55s,opacity .6s ease .55s;
}
html.tx-ready .reveal-line--serif .reveal-inner{transition-delay:.72s}
html.tx-ready .hero-detail{
  opacity:1;
  transform:translateY(0);
  transition:opacity .8s ease .92s,transform .9s var(--ease) .92s;
}
html.tx-ready .hero-detail--overlay{transition-delay:1.05s}
html.tx-ready .journey-ui{
  opacity:1;
  transform:translateY(0);
  transition:opacity .8s ease 1.08s,transform .9s var(--ease) 1.08s;
}

.journey-ui{
  position:relative;
  z-index:12;
  margin:auto var(--gutter) clamp(1.5rem,3.8vh,2.75rem);
  padding-top:clamp(3rem,8vh,6rem);
  display:grid;
  grid-template-columns:minmax(15rem,1fr) minmax(19rem,28rem) minmax(12rem,1fr);
  gap:clamp(1.5rem,3vw,3.5rem);
  align-items:end;
}
.scene-copy{
  display:flex;
  gap:1rem;
  align-items:center;
  min-width:0;
  color:rgba(255,255,255,.88);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-variant-numeric:tabular-nums;
}
.scene-count{grid-row:1 / 3;color:var(--orange)}
.scene-toggle{
  min-height:2.75rem;
  padding:.5rem .25rem;
  color:rgba(255,255,255,.76);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.scene-toggle[hidden]{display:none}
.scene-toggle:hover,.scene-toggle:focus-visible{color:var(--white)}
.journey.is-paused .scene.is-active img,
.journey.is-paused .scene-nav button.is-current::after,
html.journey-paused .film-grain{animation-play-state:paused}
.journey.is-progress-reset .scene-nav button.is-current::after{animation:none}
.scene-location{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  transition:opacity .35s ease,transform .45s var(--ease);
}
.scene-theme{
  color:rgba(255,255,255,.48);
  font-family:var(--serif);
  font-size:.95rem;
  font-style:italic;
  font-weight:400;
  letter-spacing:.03em;
  text-transform:none;
  transition:opacity .35s ease,transform .45s var(--ease);
}
.scene-location.is-changing,.scene-theme.is-changing{opacity:0;transform:translateY(7px)}
.scene-nav{
  display:grid;
  grid-template-columns:repeat(8,1fr);
  gap:.45rem;
  list-style:none;
}
.scene-nav button{
  position:relative;
  width:100%;
  height:2.75rem;
  padding-top:.7rem;
  color:rgba(255,255,255,.48);
  font-size:.7rem;
  letter-spacing:.08em;
  text-align:left;
  font-variant-numeric:tabular-nums;
  border-top:1px solid rgba(255,255,255,.33);
  transition:color .3s ease;
}
.scene-nav button::after{
  content:"";
  position:absolute;
  top:-1px;
  left:0;
  width:100%;
  height:2px;
  background:var(--orange);
  transform:scaleX(0);
  transform-origin:left;
}
.scene-nav button:hover,.scene-nav button:focus-visible,.scene-nav button.is-current{color:var(--white)}
.scene-nav button.is-current::after{animation:sceneProgress var(--scene-hold) linear forwards}
@keyframes sceneProgress{to{transform:scaleX(1)}}

.enter-link{
  justify-self:end;
  display:inline-flex;
  align-items:center;
  min-height:2.75rem;
  gap:1rem;
  color:var(--white);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.13em;
  text-decoration:none;
  text-transform:uppercase;
}
.enter-arrow{
  display:grid;
  width:2.65rem;
  height:2.65rem;
  place-items:center;
  border:1px solid rgba(255,255,255,.52);
  border-radius:50%;
  color:var(--orange);
  font-size:1.05rem;
  transition:color .35s ease,background-color .35s ease,transform .45s var(--ease);
}
.enter-link:hover .enter-arrow,.enter-link:focus-visible .enter-arrow{
  color:var(--white);
  background:var(--orange);
  border-color:var(--orange);
  transform:rotate(45deg);
}

/* Static company manifesto */
.company-page{
  color:var(--black);
  background:var(--paper);
}
.company-page .film-grain{animation:none;opacity:.022}
.company-main{min-height:100svh}
.manifesto{
  display:grid;
  grid-template-columns:minmax(24rem,43vw) minmax(0,1fr);
  min-height:100svh;
  padding-top:var(--header-h);
}
.manifesto-visual{
  position:relative;
  display:grid;
  grid-template-rows:58% 42%;
  min-height:calc(100svh - var(--header-h));
  overflow:hidden;
  background:var(--black);
}
.visual-panel{
  position:relative;
  min-height:0;
  overflow:hidden;
}
.visual-panel::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(10,12,12,.08),rgba(10,12,12,.46));
}
.visual-panel img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:contrast(1.08) brightness(.88);
}
.visual-panel--abu-dhabi img{object-position:center 56%}
.visual-panel--hollywood img{object-position:center 50%}
.visual-panel figcaption{
  position:absolute;
  z-index:2;
  right:1.4rem;
  bottom:1.2rem;
  left:1.4rem;
  color:rgba(255,255,255,.8);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.visual-splice{
  position:absolute;
  z-index:3;
  top:58%;
  right:0;
  left:0;
  height:3px;
  background:var(--orange);
}
.manifesto-copy{
  --copy-gap:clamp(3rem,7vh,6rem);
  display:flex;
  min-width:0;
  flex-direction:column;
  justify-content:space-between;
  gap:var(--copy-gap);
  padding:clamp(3rem,7.5vh,6.25rem) var(--gutter) clamp(2rem,4vh,3rem);
}
.page-label{
  display:flex;
  align-items:center;
  gap:1rem;
  color:rgba(17,19,20,.56);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.page-label span{color:var(--orange)}
.page-label::after{
  content:"";
  width:3.25rem;
  height:1px;
  background:var(--line-light);
}
.manifesto-copy h1{
  margin-top:clamp(1.8rem,4.5vh,3.25rem);
  color:var(--ink);
  font-size:clamp(3.3rem,6.25vw,7.2rem);
  font-weight:500;
  letter-spacing:-.065em;
  line-height:.81;
}
.manifesto-copy h1 em{
  color:var(--orange);
  font-family:var(--serif);
  font-weight:400;
}
.statement{
  display:grid;
  gap:clamp(1.5rem,3.5vh,2.6rem);
  max-width:53rem;
}
.manifesto-body .statement{margin-top:calc(var(--copy-gap) * .6)}
.statement-block{
  display:grid;
  grid-template-columns:2.25rem minmax(0,1fr);
  gap:clamp(1rem,2vw,1.8rem);
  padding-top:clamp(1.2rem,2.5vh,1.8rem);
  border-top:1px solid var(--line-light);
}
.statement-index{
  color:var(--orange);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.08em;
  font-variant-numeric:tabular-nums;
}
.statement p{
  max-width:54ch;
  color:#2a3031;
  font-size:clamp(1rem,1.28vw,1.22rem);
  line-height:1.65;
  text-wrap:pretty;
}
.manifesto-foot{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:1rem 2rem;
  padding-top:1.25rem;
  border-top:1px solid var(--line-light);
  color:rgba(17,19,20,.58);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.manifesto-foot a{
  display:inline-flex;
  align-items:center;
  min-height:2.75rem;
  gap:.55rem;
  color:var(--ink);
  text-decoration:none;
}
.manifesto-foot a span{color:var(--orange);transition:transform .35s var(--ease)}
.manifesto-foot a:hover span{transform:translate(3px,-3px)}

@media (max-width:1080px){
  .journey-ui{grid-template-columns:minmax(13rem,1fr) minmax(16rem,23rem) auto}
  .manifesto{grid-template-columns:minmax(20rem,38vw) minmax(0,1fr)}
  .manifesto-copy{--copy-gap:3.25rem}
}

@media (max-width:900px){
  .home-page{--overlay-clearance:calc(var(--header-h) + 6rem)}
  .home-page .site-head{
    height:auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-rows:var(--header-h) auto;
    padding-bottom:.9rem;
  }
  .home-page .head-nav{grid-column:2;grid-row:1;justify-self:end}
  .hero-detail--overlay{
    position:static;
    grid-column:1 / -1;
    grid-row:2;
  }
  .journey-ui{
    grid-template-columns:minmax(0,1fr) auto;
    row-gap:1.15rem;
  }
  .scene-nav{grid-column:1 / -1;grid-row:1}
  .scene-copy{grid-column:1;grid-row:2}
  .enter-link{grid-column:2;grid-row:2}
  .manifesto{grid-template-columns:1fr}
  .manifesto-visual{
    grid-template-columns:58% 42%;
    grid-template-rows:1fr;
    min-height:34rem;
    height:58svh;
  }
  .visual-splice{top:0;right:auto;bottom:0;left:58%;width:3px;height:auto}
  .manifesto-copy{padding-top:clamp(3.5rem,8vw,5.5rem)}
  .manifesto-copy h1{font-size:clamp(3.5rem,10.5vw,6.4rem)}
  .statement p{font-size:clamp(1rem,2.2vw,1.2rem)}
}

@media (max-width:640px){
  :root{--header-h:4.4rem}
  .home-page{--overlay-clearance:calc(var(--header-h) + 8rem)}
  .site-head{padding-inline:1.15rem}
  .brand{width:8.9rem}
  .head-nav a{gap:.65rem;font-size:.7rem}
  .home-page .head-nav a{font-size:.84rem}
  .head-nav a::before{display:none}
  .hero-copy{
    margin:max(clamp(7.3rem,19vh,9rem),var(--overlay-clearance,0px)) 1.2rem 0;
  }
  .reveal-inner{font-size:clamp(3.4rem,16vw,5.9rem);line-height:.9}
  .reveal-line--serif{margin-top:.35em;margin-left:.3rem}
  .reveal-line--serif .reveal-inner{font-size:clamp(3.25rem,14.5vw,5.45rem);line-height:.9}
  .hero-detail--overlay{line-height:1.65}
  .journey-ui{margin-right:1.2rem;margin-bottom:1.15rem;margin-left:1.2rem}
  .scene-nav{gap:.28rem}
  .scene-nav button{padding-top:.5rem}
  .scene-nav button span{font-size:.75rem}
  .scene-copy{gap:.8rem;font-size:.75rem}
  .scene-theme{font-size:.83rem}
  .enter-link{gap:.65rem;font-size:.66rem}
  .enter-arrow{width:2.35rem;height:2.35rem}
  .manifesto-visual{
    grid-template-columns:1fr;
    grid-template-rows:58% 42%;
    min-height:31rem;
    height:63svh;
  }
  .visual-splice{top:58%;right:0;bottom:auto;left:0;width:auto;height:3px}
  .visual-panel figcaption{right:1rem;bottom:.9rem;left:1rem;font-size:.68rem}
  .manifesto-copy{--copy-gap:3rem;padding:3.5rem 1.2rem 2rem}
  .manifesto-copy h1{font-size:clamp(3.1rem,15vw,5rem);line-height:.84}
  .statement-block{grid-template-columns:1.7rem minmax(0,1fr);gap:.65rem}
  .statement p{font-size:1rem;line-height:1.68}
  .manifesto-foot{align-items:flex-start;flex-direction:column}
}

@media (max-height:720px) and (min-width:641px){
  .hero-copy{margin-top:max(7.5rem,var(--overlay-clearance,0px))}
  .reveal-inner{font-size:clamp(3.8rem,9.2vw,7rem)}
  .reveal-line--serif .reveal-inner{font-size:clamp(3.6rem,7.8vw,6.2rem)}
  .journey-ui{margin-bottom:1.35rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    animation-delay:0s!important;
    transition-duration:.001ms!important;
    transition-delay:0s!important;
  }
  .film-grain,.page-wipe,.splice{display:none!important}
  .scene:not(.is-active){opacity:0}
  .scene.is-active img{animation:none}
  .scene-media{transform:none}
  .js .hero-detail,.js .journey-ui,.js .reveal-inner,.reveal-inner{opacity:1;transform:none}
}
