:root{color-scheme:light;--bg:#fff;--ink:#000;--pill:#eaeaea;--stripe:#f3f3f3;--line:#777;--muted:#505050;--gutter:clamp(20px,5.5556vw,80px);font-family:"Trade Gothic LT Std","Helvetica Neue",Arial,sans-serif;scroll-behavior:smooth}
:root[data-theme=dark]{color-scheme:dark;--bg:#000;--ink:#fff;--pill:#171717;--stripe:#f3f3f3;--line:#888;--muted:#b5b5b5}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);transition:background .3s,color .3s}a{color:inherit}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid currentColor;outline-offset:4px}h1,h2,p{margin:0}p{line-height:1.55}.wrap{max-width:1600px;margin:auto;padding-inline:var(--gutter)}header{position:absolute;z-index:2;top:clamp(16px,2.78vw,40px);width:100%}.bar,.controls,nav{display:flex;align-items:center}.bar{justify-content:space-between}.controls{gap:clamp(6px,1.66vw,24px)}.pill{display:inline-flex;align-items:center;justify-content:center;min-height:48px;border-radius:100px;background:var(--pill);padding:0 clamp(12px,1.66vw,24px);font:inherit;font-size:14px;text-decoration:none;border:0;color:inherit}.pill a{text-decoration:none}nav{gap:clamp(9px,1.66vw,24px)}button.pill{width:48px;padding:0;font-size:20px;cursor:pointer}
.hero{min-height:clamp(630px,71.11vw,1024px);position:relative;display:flex;align-items:flex-end;padding-bottom:clamp(40px,5.55vw,80px)}.hero-copy{width:100%;container-type:inline-size}.hero h1{font-size:11.92cqw;line-height:.92;letter-spacing:-.025em;white-space:nowrap}.hero p{margin-top:clamp(24px,2.78vw,40px);font-size:16px}.section{padding-block:clamp(64px,11.1vw,160px) clamp(50px,5.55vw,80px);scroll-margin-top:0}h2{font-size:clamp(40px,4.45vw,64px);letter-spacing:-.045em;line-height:1}.intro{margin-top:24px}.work-list{margin-top:clamp(36px,5.55vw,80px)}summary{list-style:none;cursor:pointer} :is(summary,.work-upcoming-row){display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:clamp(19px,1.95vw,28px);font-weight:600}summary::-webkit-details-marker{display:none}.arrow{display:inline-block;font-size:.7em;margin-left:.35em;transition:transform .25s}details[open] .arrow{transform:rotate(-90deg)}.tag{font-size:12px;font-weight:400;border-radius:100px;background:var(--pill);padding:8px 15px;white-space:nowrap}.cards{display:grid;grid-template-columns:repeat(var(--columns,1),minmax(0,1fr));gap:24px;padding-bottom:24px}details[open] .cards{animation:appear .35s ease both}@keyframes appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.card{display:block;text-decoration:none}.card-inner{aspect-ratio:1.035;background:#f3f3f3;color:#111;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(14px,2vw,28px);gap:12px}.card:hover .card-inner{background:#dedede}.card-inner strong{font-size:clamp(18px,2vw,28px)}.card-inner small{font-size:12px}.about{display:grid;grid-template-columns:1fr 1fr;gap:40px}.about p+p{margin-top:24px}.logos{display:flex;align-items:center;flex-wrap:wrap;gap:clamp(12px,2vw,30px);margin-top:clamp(32px,5.5vw,80px)}.logos img{display:block}.logos.dark,:root[data-theme=dark] .logos.light{display:none}:root[data-theme=dark] .logos.dark{display:flex}.contact p,.case p{margin-top:24px;color:var(--muted)}.case{padding-top:clamp(135px,16vw,230px);padding-bottom:80px;min-height:90svh}.case h1{font-size:clamp(44px,8vw,112px);line-height:1;letter-spacing:-.06em;margin-top:40px}.case h2{font-size:clamp(25px,3vw,40px);margin-top:25px}.reveal{animation:appear .55s ease both}
@media(max-width:650px){.pill{font-size:12px;min-height:44px}.bar .home{padding-inline:10px}button.pill{width:44px}.hero{min-height:clamp(470px,82svh,680px)}.hero h1{font-size:11.7cqw}.hero p{max-width:36ch}.about{grid-template-columns:1fr;gap:26px}.cards{grid-template-columns:1fr;gap:12px}.card-inner{aspect-ratio:1.7}.tag{padding:6px 8px;font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@font-face{font-family:Portfolio;src:url(assets/TradeGothicLTStd-Extended.otf) format("opentype");font-weight:400;font-display:swap}
@font-face{font-family:Portfolio;src:url(assets/TradeGothicLTStd-BoldExt.otf) format("opentype");font-weight:600 900;font-display:swap}
:root{font-family:Portfolio,"Helvetica Neue",Arial,sans-serif}
.hero h1{letter-spacing:0}
@media(max-width:350px){nav.pill{gap:6px;padding-inline:8px}.bar .home{padding-inline:8px}.controls{gap:4px}.pill{font-size:10px}}
.bt-logo{position:relative;display:block;width:32px;height:32px;flex:none}.bt-logo img{position:absolute}.bt-logo img:nth-child(2){left:24.31%;top:32.95%}.bt-logo img:nth-child(3){left:52.45%;top:32.95%}.logos img[alt="Balance Agency"]{width:40px;height:40px;object-fit:cover}.logos img[alt="Transport for London"]{transform:scaleY(-1)}.cards:has(> :only-child){grid-template-columns:minmax(0,1fr)}
@media(min-width:1000px){.logos{gap:32px}}
@font-face{font-family:Inter Glyphs;src:url(assets/Inter-Regular.woff2) format("woff2");font-display:swap}
.glyph,.arrow,button.pill{font-family:"Inter Glyphs",sans-serif;font-weight:400}
header{position:fixed;pointer-events:none}
header .pill{pointer-events:auto}
html{--header-clearance:clamp(84px,9vw,124px);scroll-padding-top:var(--header-clearance)}

:root{--canvas-dot:#E5E5E5;--canvas-dot-dark:#363636}
:root[data-theme=dark]{--canvas-dot:var(--canvas-dot-dark)}
body,.site-loader-top,.site-loader-bottom{
  background-image:radial-gradient(circle at center,var(--canvas-dot) .8px,transparent 1.35px);
  background-size:27px 27px;
}

header .bar{
  width:calc(100% - 2 * clamp(12px,2.78vw,40px));
  padding:16px 16px 16px 24px;
  border-radius:100px;
  background:rgb(255 255 255 / 8%);
  backdrop-filter:blur(12px);
}
header :is(a.home,nav a,button.pill){
  color:var(--ink);
  border-radius:100px;
  text-decoration:none;
}
header button.pill{background:transparent}
header nav.pill{
  min-height:0;padding:0;gap:0;
  background:none;backdrop-filter:none;
}
header .home{min-height:40px}
header nav a{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:40px;padding-inline:24px;
}
header button.pill{min-height:40px;width:40px;font-size:14px}
:is(header a,header button,.case > a){
  translate:var(--magnet-x,0) var(--magnet-y,0);
  transition:translate .38s cubic-bezier(.2,.75,.3,1.2);
}
:is(header a,header button,.case > a):hover{transition-duration:.18s}
.case > a{display:inline-block}
@media(max-width:650px){
  header nav a{padding-inline:clamp(8px,2.5vw,15px);min-height:44px}
  header .home{min-height:44px;padding-inline:12px}
  header button.pill{width:44px;min-height:44px}
}

:root{--nav-link-size:12px}
header :is(a.home,nav a){font-size:var(--nav-link-size);line-height:1.5}
header .controls{gap:0}
.tag{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:2px 12px;
  border:.5px solid currentColor;
  background:transparent;
}
@media(max-width:650px){.tag{padding-inline:8px}}

.case > a:hover{text-decoration:none}

.about{grid-template-columns:minmax(0,1fr);gap:clamp(32px,5vw,72px)}
.about .logos{margin-top:clamp(24px,3.3vw,48px)}
.about-copy p{
  font-size:clamp(26px,4.2vw,64px);
  line-height:1.16;
  letter-spacing:-.045em;
}
.about-copy p span{
  color:color-mix(in srgb,var(--ink) var(--reveal-fill,100%),var(--muted));
}
:root[data-theme=light] .about-copy p{--muted:#f3f3f3}
:root[data-theme=dark] .about-copy p{--muted:#858585}
@media(prefers-reduced-motion:reduce){.about-copy p span{color:inherit}}

@media(min-width:651px){
  .cards:has(> :nth-child(3)){
    grid-template-columns:repeat(3,minmax(0,1fr));
    grid-template-rows:repeat(2,minmax(0,1fr));
    aspect-ratio:2 / 1;
    box-sizing:content-box;
  }
  .cards:has(> :nth-child(3)):where(:not(.cards-originals)) > .card:first-child{grid-area:span 2 / span 2}
  .cards:has(> :nth-child(3)) .card-inner{height:100%;aspect-ratio:auto}
}

.card{position:relative}
.about{
  --logo-spacing:clamp(72px,11.12vw,160px);
  gap:var(--logo-spacing);
  padding-block-end:var(--logo-spacing);
  align-content:start;
}
.about + .contact{padding-block-start:0}
.about-copy p{font-size:clamp(24px,3.35vw,40px);font-weight:700;line-height:1.2;letter-spacing:normal}
.about .about-copy p+p{margin-top:1.2em}
.about-brands{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:clamp(24px,5.56vw,80px)}
.about-brands img{display:block}
.about-brands .bt-logo{width:40px;height:40px}
.about-brands img[alt="Transport for London"]{transform:scaleY(-1)}
.about-brands img[alt="Balance Agency"]{object-fit:cover}
:root[data-theme=dark] .about-brands > img:not([alt="Balance Agency"]),
:root[data-theme=dark] .about-brands .bt-logo{filter:invert(1)}

.about-intro.wrap{width:100%;margin-block:0}
.about-marquee{
  overflow:hidden;
  mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent);
}
.about-track{
  display:flex;
  width:max-content;
  animation:about-marquee 56s linear infinite;
}
.about-track .about-brands{
  flex:none;
  width:max-content;
  min-width:100vw;
  justify-content:space-between;
  flex-wrap:nowrap;
  gap:clamp(40px,6vw,96px);
  padding-inline:clamp(20px,3vw,48px);
}
.about-track .about-brands > *{flex:none}
.about-marquee:hover .about-track{animation-play-state:paused}
@keyframes about-marquee{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){
  .about-marquee{mask-image:none}
  .about-track{width:100%}
  .about-track .about-brands{
    width:100%;
    min-width:0;
    flex-wrap:wrap;
    justify-content:center;
    gap:clamp(24px,5vw,80px);
  }
  .about-track .about-brands[aria-hidden]{display:none}
}

.hero{
  min-height:100vh;
  min-height:100dvh;
  padding-bottom:clamp(20px,7.8dvh,80px);
}
@media(max-height:560px){
  .hero{
    padding-top:clamp(70px,19dvh,112px);
    padding-bottom:clamp(14px,5dvh,28px);
  }
  .hero p{margin-top:clamp(10px,4dvh,22px);font-size:clamp(12px,3.8dvh,16px)}
}

.work-list{
  --panel-space:max(120px,calc(100dvh - var(--header-clearance) - 104px));
}
.work-list .cards{max-height:var(--panel-space)}
.work-list .card-inner{max-height:var(--panel-space)}
.work-list .cards:has(> :nth-child(3)){max-height:calc(var(--panel-space) - 24px)}
@media(max-width:650px){
  .work-list .cards:has(> :nth-child(3)){
    height:min(calc(var(--panel-space) - 24px),135vw);
    box-sizing:content-box;
    grid-template-rows:repeat(3,minmax(0,1fr));
  }
  .work-list .cards:has(> :nth-child(3)) .card-inner{height:100%;aspect-ratio:auto}
}

.card-inner:has(img){display:block;padding:0;background:none}
.card-inner img{display:block;width:100%;height:100%;object-fit:contain}
.bt-gallery{margin-top:clamp(32px,6vw,80px)}
.bt-gallery h2{margin-block:36px 24px}
.bt-media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.bt-media img,.bt-media video{display:block;width:100%;height:auto}
.bt-media video{aspect-ratio:16 / 9;background:#111}
.bt-media figure{margin:0}
.bt-media figcaption{margin-top:10px;font-size:14px}
@media(max-width:650px){.bt-media{grid-template-columns:1fr}}

.card:hover .card-inner:has(img){background:none}

.work-list .cards.cards-bt{
  box-sizing:content-box;
  width:100%;
  max-height:none;
  height:auto;
  aspect-ratio:3 / 2;
  grid-template-columns:repeat(12,minmax(0,1fr));
  grid-template-rows:minmax(0,1.72fr) minmax(0,1fr);
  gap:clamp(6px,1vw,16px);
}
.work-list .cards-bt .card:nth-child(1){grid-area:1 / 1 / 2 / span 4}
.work-list .cards-bt .card:nth-child(2){grid-area:1 / 5 / 2 / span 8}
.work-list .cards-bt .card:nth-child(3){grid-area:2 / 1 / 3 / span 3}
.work-list .cards-bt .card:nth-child(4){grid-area:2 / 4 / 3 / span 6}
.work-list .cards-bt .card:nth-child(5){grid-area:2 / 10 / 3 / span 3}
.work-list .cards-bt .card-inner{
  display:block;
  height:100%;
  padding:0;
  aspect-ratio:auto;
  overflow:hidden;
  background:none;
}
.cards-bt .card-inner :is(img,video){
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .55s cubic-bezier(.2,.75,.25,1);
}
@media(hover:hover){
  .cards-bt .card:hover :is(img,video){transform:scale(1.035)}
}

@supports selector(::details-content){
  @media(prefers-reduced-motion:no-preference){
    #work details{
      --accordion-ease:cubic-bezier(.18,.62,.3,1);
    }
    #work details::details-content{
      display:grid;
      grid-template-columns:minmax(0,1fr);
      grid-template-rows:0fr;
      overflow:clip;
      transition:grid-template-rows .55s var(--accordion-ease),
                 content-visibility .55s allow-discrete;
    }
    #work details[open]::details-content{grid-template-rows:1fr}
    #work .work-panel{
      min-width:0;
      min-height:0;
      overflow:hidden;
      opacity:0;
      translate:0 -6px;
      transition:opacity .32s ease,translate .55s var(--accordion-ease);
    }
    #work details[open] > .work-panel{opacity:1;translate:none}
    #work details[open] .cards{animation:none}
    #work .arrow{transition:transform .55s var(--accordion-ease)}
  }
}

@media(prefers-reduced-motion:no-preference){
  main > section{transition:opacity .48s ease-in-out}
  .section-reveal-pending:not(:focus-within){opacity:0;pointer-events:none}
}


.about-profile{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,2fr);
  align-items:center;
  gap:clamp(24px,5.56vw,80px);
}
.about-portrait{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:400 / 468;
  object-fit:cover;
}
.about-profile .about-copy p{font-size:clamp(20px,2.23vw,32px)}
@media(max-width:760px){
  .about-profile{grid-template-columns:1fr}
  .about-portrait{max-width:400px}
}

header a.home{
  color:var(--ink);
  background:transparent;
  padding-inline:0;
  justify-content:flex-start;
  translate:none;
  font-size:16px;
  font-weight:400;
}
.hero-name{display:inline-block}
@media(max-width:760px){
  .hero{padding-top:var(--header-clearance)}
}
@media(max-width:650px){header a.home{font-size:12px}}

@media(prefers-reduced-motion:no-preference){
  .content-reveal{
    opacity:0;
    filter:blur(8px);
    transition:opacity .55s ease,filter .65s ease;
  }
  .content-reveal:is(.content-in-view,:focus-within){opacity:1;filter:blur(0)}
}

.bt-story{max-width:980px}
.bt-story .bt-lede{max-width:29ch;font-size:clamp(20px,3vw,38px);line-height:1.25}
.bt-facts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  margin:clamp(32px,5vw,64px) 0 0;
  padding-block:24px;
  border-block:1px solid var(--line);
}
.bt-facts dt,.bt-chapter .bt-stage{font-size:12px;color:var(--muted)}
.bt-facts dd{margin:8px 0 0;font-size:14px;line-height:1.55}
.bt-chapter{margin-top:clamp(52px,8vw,112px)}
.bt-chapter h2{margin-top:12px;max-width:27ch;line-height:1.12}
.bt-chapter > p:not(.bt-stage){max-width:66ch}
.bt-chapter strong{color:var(--ink)}
.bt-feature{margin:32px 0 0}
.bt-feature video{display:block;width:100%;max-height:72svh;background:#111}
.bt-feature figcaption{margin-top:12px;font-size:13px;color:var(--muted)}
@media(max-width:650px){.bt-facts{grid-template-columns:1fr;gap:16px}}

@media(max-width:650px){
  header .bar{padding:8px}
  header nav a{padding-inline:clamp(6px,1.8vw,12px)}
}
@media(max-width:360px){
  :root{--nav-link-size:11px}
  header a.home{font-size:var(--nav-link-size)}
}

.bt-story .bt-ownership{margin-top:14px}
.bt-decision{margin-top:clamp(28px,4vw,52px)}
.bt-decision h3{margin:0;font-size:clamp(17px,2vw,24px)}
.bt-decision p{max-width:66ch;margin-top:12px}
.bt-feature img{display:block;width:auto;max-width:100%;height:auto;max-height:78svh;object-fit:contain}

.work-list .cards.cards-originals{
  box-sizing:content-box;
  width:100%;
  max-height:none;
  height:auto;
  aspect-ratio:2.04;
  grid-template-columns:repeat(12,minmax(0,1fr));
  grid-template-rows:repeat(2,minmax(0,1fr));
  gap:clamp(6px,1vw,16px);
}
.work-list .cards-originals > .card{grid-area:auto;grid-column:span 3;min-height:0}
.work-list .cards-pollinate > .card:is(:first-child,:last-child),
.work-list .cards-transport-for-london > .card:nth-child(5){grid-column:span 6}
.work-list .cards-transport-for-london > .card:first-child{grid-column:span 4}
.work-list .cards-transport-for-london > .card:nth-child(3){grid-column:span 5}
.work-list .cards-originals .card-inner{
  height:100%;
  aspect-ratio:auto;
  overflow:hidden;
}
.cards-originals .card-inner img{object-fit:cover;transition:transform .55s cubic-bezier(.2,.75,.25,1)}
@media(hover:hover){
  .cards-originals .card:hover img{transform:scale(1.035)}
}

.work-list .cards-lloyds > .card:is(:nth-child(2),:nth-child(4)){grid-column:span 6}
.cards-originals picture{display:block;height:100%}
.bt-gallery h2+p{margin-bottom:24px;max-width:68ch}

.contact-card{
  padding:clamp(24px,4.3vw,64px);
  border-radius:clamp(20px,2.25vw,36px);
  background:var(--bg);
  box-shadow:0 5px 24px rgb(0 0 0 / 8%);
}
:root[data-theme=dark] .contact-card{
  background:#171717;
  box-shadow:0 5px 24px rgb(0 0 0 / 38%);
}
.contact-links,.contact-credit{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
}
.tag,.contact-links p{color:var(--ink);font-size:10px;line-height:1.5}
.contact-links p{margin:0 0 4px}
.contact-links a{
  font-size:var(--nav-link-size);
  line-height:1.5;
  text-decoration:none;
}
.contact-links a:hover{text-decoration:underline;text-underline-offset:.16em}
.contact-credit{
  margin-top:clamp(32px,4.8vw,72px);
  align-items:baseline;
  flex-wrap:wrap;
  font-size:clamp(11px,1.15vw,14px);
}
@media(max-width:520px){
  .contact-links{flex-direction:column}
  .contact-credit{gap:10px 18px}
}


main{--media-radius:clamp(6px,1vw,16px)}
main :is(img,video),.work-list .card-inner{border-radius:var(--media-radius)}
.work-list .card-inner{overflow:hidden}
.work-list :is(.cards-bt,.cards-originals) .card-inner{max-height:none}

.about-brands img{border-radius:0}

/* Dark mode icon by alix, Noun Project (public domain). */
#theme::before{
  content:"";
  width:16px;
  height:16px;
  background:currentColor;
  mask:url(assets/dark-mode-icon.png) center / contain no-repeat;
}

header :is(a.home,nav a,#theme){align-items:center}
header :is(a.home,nav a) > span{
  display:block;
  line-height:1;
  text-box:trim-both cap alphabetic;
}
header :is(nav a,#theme){translate:var(--magnet-x,0) 0}

body.has-pointer-grid{background-image:none;isolation:isolate}
.pointer-grid{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:-1;
  pointer-events:none;
}

@media(max-width:760px){
  .about{--logo-spacing:clamp(104px,16vw,136px)}
  .about-profile{gap:var(--logo-spacing)}
  .about-portrait{max-width:none}
  #work .work-list .cards{
    display:flex;
    flex-direction:column;
    width:100%;
    height:auto;
    max-height:none;
    aspect-ratio:auto;
    gap:12px;
  }
  #work .work-list .cards > .card{min-width:0}
  #work .work-list .card-inner{height:auto;max-height:none;aspect-ratio:1.45}
  #work .work-list .card-inner:has(img,video){aspect-ratio:auto}
  #work .work-list .card-inner :is(img,video,picture){width:100%;height:auto}
  #work .work-list .card:focus-visible{outline-offset:-3px}
}


.work-description{margin:0 0 20px;width:100%;max-width:72ch;overflow-wrap:anywhere}
.work-list details + details,
.work-upcoming{position:relative}
.work-list details + details::before,
.work-upcoming::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  background:var(--ink);
  mask:url(assets/work-divider.svg) left top repeat-x;
  pointer-events:none;
}
.work-list summary{
  padding-block:24px;
  gap:12px 24px;
  flex-wrap:wrap;
  font-size:24px;
  line-height:1.2;
}
.work-list details:first-child summary{padding-top:0}
.work-project-name{flex:1 1 auto}
.work-tags{display:flex;flex-wrap:wrap;gap:8px;margin-inline-start:auto}
.work-tags .tag{height:24px;padding-inline:12px}
.work-upcoming{
  display:grid;
  gap:16px;
  padding-top:24px;
  color:#c3c3c3;
}
.work-upcoming-row{font-size:16px;line-height:1.2}
.work-status{font-size:10px;line-height:1.5;font-weight:400;white-space:nowrap;padding:8px}
@media(max-width:650px){
  .work-list summary{font-size:clamp(19px,4.8vw,24px)}
  .work-tags .tag{padding-inline:8px}
}


.site-loader:not([hidden]){
  position:fixed;
  inset:0;
  z-index:1000;
  overflow:hidden;
  display:grid;
  place-items:center;
  color:#fff;
}
.site-loader-top,.site-loader-bottom{
  position:absolute;
  inset-inline:0;
  --canvas-dot:var(--canvas-dot-dark);
  height:50%;
  background-color:#000;
  transition:transform .65s cubic-bezier(.76,0,.24,1);
}
.site-loader-top{top:0;height:calc(50% + 1px)}
.site-loader-bottom{bottom:0;background-position:0 calc(-50dvh)}
.site-loader-progress{
  position:absolute;
  inset:0 0 auto;
  height:3px;
  background:#fff;
  transform:scaleX(var(--loader-progress,0));
  transform-origin:left;
}
.site-loader-count{
  position:relative;
  font-family:Portfolio,"Helvetica Neue",Arial,sans-serif;
  font-size:32px;
  font-weight:700;
  line-height:normal;
  text-align:center;
  text-box:trim-both cap alphabetic;
  font-variant-numeric:tabular-nums;
}
.site-loader-revealing{pointer-events:none}
.site-loader-revealing .site-loader-top{transform:translateY(-100%)}
.site-loader-revealing .site-loader-bottom{transform:translateY(100%)}
.site-loader-revealing :is(.site-loader-count,.site-loader-progress){visibility:hidden}
@media(prefers-reduced-motion:reduce){
  .site-loader:not([hidden]){display:none}
}