@font-face{font-family:'Rowan';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/Rowan-Regular.otf') format('opentype')}
  @font-face{font-family:'Rowan';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/Rowan-Italic.otf') format('opentype')}
  @font-face{font-family:'Rowan';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/Rowan-Medium.otf') format('opentype')}
  @font-face{font-family:'Rowan';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/Rowan-Semibold.otf') format('opentype')}
  :root{
    --bg:#FAFAFA;
    --ink:#191919;
    --muted:#646464;
    --green:#5CE65C;
    --hair:rgba(40,40,40,.35);
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  html{--scroll-lag-y:0px}
  body{background:var(--bg);color:var(--ink);font-family:'Inter',-apple-system,Roboto,Helvetica,sans-serif;font-feature-settings:"ss01","cv11";-webkit-font-smoothing:antialiased}
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  a{color:inherit;text-decoration:none}
  img{display:block;width:100%;height:100%;object-fit:cover}
  button{font:inherit;background:none;border:0;cursor:pointer;color:inherit}
  .mob-menu-btn{display:none}
  .cap{font-size:12px;letter-spacing:.6px;text-transform:uppercase;font-weight:400;line-height:1.2}
  .square{width:10px;height:10px;display:inline-block;flex:0 0 10px;background:var(--ink)}

  .menu-overlay{position:fixed;inset:0;z-index:100;background:#111;color:#FDFDFD;display:flex;flex-direction:column;transform:translateY(-100%);transition:transform .55s cubic-bezier(.7,0,.2,1);will-change:transform;overflow-y:auto}
  .menu-overlay[data-open="true"]{transform:translateY(0)}
  body.menu-open{overflow:hidden}
  .menu-overlay .mo-top{display:grid;grid-template-columns:repeat(16,1fr);align-items:center;padding:28px 0;border-bottom:1px solid rgba(253,253,253,.15)}
  .menu-overlay .mo-top .brand{grid-column:1/span 4;padding-left:40px;font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:#FDFDFD}
  .menu-overlay .mo-top .mid{grid-column:7/span 4;font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:rgba(253,253,253,.6)}
  .menu-overlay .mo-top .close-wrap{grid-column:16/span 1;padding-right:40px;display:flex;justify-content:flex-end}
  .menu-overlay .close-btn{width:40px;height:40px;border-radius:50%;background:var(--green);color:#191919;display:grid;place-items:center;transition:background-color .28s ease,border-color .28s ease,color .28s ease}
  .menu-overlay .close-btn:hover{transform:rotate(90deg)}
  .menu-overlay .close-btn svg{width:14px;height:14px}
  .menu-overlay .mo-grid{display:grid;grid-template-columns:repeat(16,1fr);flex:1 0 auto;padding:80px 0 60px;align-items:start;gap:60px 0}
  .menu-overlay .nav-list{grid-column:2/span 9;display:flex;flex-direction:column}
  .menu-overlay .nav-list a{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0;border-top:1px solid rgba(253,253,253,.12);color:#FDFDFD;font-size:56px;font-weight:500;letter-spacing:-1.2px;line-height:1;transition:padding .35s ease,color .25s ease;position:relative}
  .menu-overlay .nav-list a:last-child{border-bottom:1px solid rgba(253,253,253,.12)}
  .menu-overlay .nav-list a .num{font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:rgba(253,253,253,.45);font-weight:400;align-self:flex-start;padding-top:6px}
  .menu-overlay .nav-list a:hover{padding-left:0;color:#FDFDFD}
  .menu-overlay .nav-list a:hover .num{color:rgba(253,253,253,.45)}
  .menu-overlay .mo-side{grid-column:12/span 4;padding-right:40px;display:flex;flex-direction:column;gap:48px}
  .menu-overlay .mo-side .blk{display:flex;flex-direction:column;gap:14px}
  .menu-overlay .mo-side .blk h4{font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:rgba(253,253,253,.55);font-weight:400;margin-bottom:4px}
  .menu-overlay .mo-side .blk p,.menu-overlay .mo-side .blk a{font-size:14px;line-height:1.45;color:#FDFDFD;letter-spacing:-.1px}
  .menu-overlay .mo-foot{display:grid;grid-template-columns:repeat(16,1fr);padding:28px 0;border-top:1px solid rgba(253,253,253,.12);align-items:center}
  .menu-overlay .mo-foot .l{grid-column:2/span 6;font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:rgba(253,253,253,.55)}
  .menu-overlay .mo-foot .r{grid-column:12/span 4;padding-right:40px;font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:rgba(253,253,253,.55);text-align:right}

  .cover{height:auto;min-height:0;position:relative;overflow:visible;background:var(--bg)}
  .cover .nav-bar{position:relative;left:0;right:0;top:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:26px 40px;z-index:5}
  .cover .nav-bar .logo{font-size:18px;font-weight:600;letter-spacing:-.2px;color:var(--ink)}
  .cover .nav-bar .logo a{display:inline-flex;align-items:center}
  .cover .nav-bar .logo img{height:28px;width:auto;display:block;filter:none;position:static;inset:auto;object-fit:contain}
  .cover .nav-bar .logo sup{font-size:9px;font-weight:500;vertical-align:super;margin-left:2px;opacity:.7}
  .cover .nav-bar .links{display:flex;gap:36px}
  .cover .nav-bar .links a{color:var(--ink);font-size:12px;letter-spacing:.8px;text-transform:uppercase;font-weight:400;transition:opacity .2s}
  .cover .nav-bar .links a:hover{opacity:1}
  .cover .nav-bar .right{display:flex;justify-content:flex-end;align-items:center;gap:18px}
  .cover .nav-bar .right a{color:#191919;font-size:12px;letter-spacing:.6px;text-transform:uppercase;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:14px;border:0;background:#5CE65C;font-weight:500;transition:background .28s,border-color .28s,color .28s}
  .cover .nav-bar .right a:hover{border-color:rgba(255,255,255,.72)}
  .cover .nav-bar .right a .nav-arrow{display:inline-flex;align-items:center;line-height:1;margin-left:1px}.cover .nav-bar .right a .nav-arrow svg{display:block;overflow:visible}
  .cover .hero-menu-btn{width:36px;display:flex;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:0}
  .cover .hero-menu-btn i{display:block;height:1.5px;background:currentColor;transition:transform .3s}
  .cover .hero-menu-btn:hover i:first-child{transform:translateY(1.5px)}
  .cover .hero-menu-btn:hover i:last-child{transform:translateY(-1.5px)}
  .cover > .cover-image{display:none!important}
  .cover-live-link{
    position:absolute;
    left:40px;
    bottom:40px;
    z-index:6;
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-height:40px;
    padding:0 15px;
    border-radius:14px;
    background:var(--green);
    color:var(--ink);
    font-size:12px;
    letter-spacing:.6px;
    text-transform:uppercase;
    font-weight:600;
    overflow:hidden;
    isolation:isolate;
  }
  .cover-live-link::before{
    content:"";
    position:absolute;
    inset:-1px;
    border-radius:inherit;
    pointer-events:none;
    z-index:0;
    opacity:0;
    background:linear-gradient(90deg,rgba(255,255,255,.4),rgba(255,255,255,0)) left/0 100% no-repeat,linear-gradient(270deg,rgba(255,255,255,.4),rgba(255,255,255,0)) right/0 100% no-repeat,linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,0)) top/100% 0 no-repeat,linear-gradient(0deg,rgba(255,255,255,.34),rgba(255,255,255,0)) bottom/100% 0 no-repeat;
    transition:opacity .38s ease,background-size .68s cubic-bezier(.22,1,.36,1);
  }
  .cover-live-link:hover::before{opacity:1;background-size:28% 100%,28% 100%,100% 28%,100% 28%}
  .cover-live-link > span{position:relative;z-index:1}
  .cover > .cover-image,
  .wide-img img,
  .more-card .thumb img{transform:translate3d(0,var(--scroll-lag-y),0) scale(1.016);transition:transform .52s cubic-bezier(.16,1,.3,1);will-change:transform}
  .cover > .cover-image{animation:heroImageIn 1.25s cubic-bezier(.16,1,.3,1) both}
  .cover .nav-bar{animation:heroNavIn .9s cubic-bezier(.16,1,.3,1) .18s both}
   @keyframes heroImageIn{
    from{opacity:.72;filter:brightness(.72);transform:translate3d(0,var(--scroll-lag-y),0) scale(1.06)}
    to{opacity:1;filter:brightness(1);transform:translate3d(0,var(--scroll-lag-y),0) scale(1.016)}
  }
   @keyframes heroNavIn{
    from{opacity:0;transform:translateY(-14px)}
    to{opacity:1;transform:translateY(0)}
  }

  .overview{background:var(--bg);display:flex;justify-content:center;align-items:center;overflow:hidden}
  .overview .inner{width:1440px;max-width:1440px;padding:124px 20px 160px;display:flex;justify-content:center;align-items:center;overflow:hidden}
  .overview .content{display:flex;align-items:flex-start;gap:30px;width:100%}
  .overview .left{width:280px;display:flex;align-items:center}
  .overview .label{font-size:19px;line-height:29px;color:var(--ink);display:flex;gap:26px;align-items:center}
  .overview .right{width:1090px;min-height:166px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:42px;align-items:start;overflow:visible}
  .overview p{width:981px;max-width:981px;color:var(--ink);font-size:31px;font-weight:400;line-height:41.6px;letter-spacing:-.32px}
  .overview .right > p{width:auto;max-width:none}
  .project-summary{display:grid;grid-template-columns:1fr;gap:16px;margin-top:2px;width:auto;max-width:none;align-self:start}
  .project-summary p{width:auto;max-width:none;font-size:13px;line-height:1.45;letter-spacing:.1px;color:rgba(25,25,25,.72);font-family:'Inter',-apple-system,Roboto,Helvetica,sans-serif}
  .project-summary .live-link{
    display:inline-flex;
    align-items:center;
    min-height:38px;
    padding:0 14px;
    border-radius:14px;
    background:var(--green);
    color:var(--ink);
    font-size:12px;
    letter-spacing:.6px;
    text-transform:uppercase;
    font-weight:600;
  }

  .work-media{background:var(--bg)}
  .media-section{display:flex;justify-content:center;align-items:center;overflow:hidden;background:var(--bg)}
  .media-container{width:1440px;max-width:1440px;padding:20px;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden}
  .media-stack{display:flex;flex-direction:column;align-items:flex-start;gap:40px;width:100%;overflow:hidden}
  .wide-img{width:100%;aspect-ratio:135/76;overflow:hidden;background:#EDEDE8}
  .wide-16{aspect-ratio:16/9}

  .more{background:var(--bg);padding:120px 40px 100px;overflow:hidden}
  .more .inner{max-width:none;width:100%;padding:0;display:block;overflow:hidden}
  .more .ph-head{display:flex;align-items:center;gap:26px;margin-bottom:36px}
  .more .ph-head span{font-weight:600;font-size:15px}
  .more h2{font-family:'Rowan','Times New Roman',serif;color:var(--ink);font-size:42px;font-weight:500;letter-spacing:-.01em;margin-bottom:24px;line-height:1.05}
  .more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;width:100%;overflow:hidden}
  .more-card{display:flex;flex-direction:column;gap:24px;overflow:hidden}
  .more-card .thumb{width:100%;aspect-ratio:43/29;overflow:hidden;background:#0d0d0d}
  .more-card .caption{display:grid;grid-template-columns:1fr auto auto;gap:32px;align-items:baseline;padding-top:4px}
  .more-card .caption .name{font-size:22px;font-weight:500;letter-spacing:-.4px;line-height:1.2}
  .more-card .caption .type,
  .more-card .caption .yr{font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);white-space:nowrap}

  footer.bottom{background:var(--green);padding:60px 0 40px;margin-top:0;color:var(--ink);position:relative}
  footer.bottom .row1{display:flex;justify-content:space-between;padding:0 40px 8px}
  footer.bottom .row1 .cap{font-size:10px}
  footer.bottom .wordmark{padding:6px 0 0;display:flex;justify-content:center}
  footer.bottom .wordmark img{width:90%;max-width:1200px;height:auto;display:block;margin:0 auto}
  footer.bottom .nav-grid{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));padding:40px 0;align-items:start}
  footer.bottom .nav-grid .col-left{grid-column:1/span 3;padding-left:40px;display:flex;flex-direction:column;gap:4px}
  footer.bottom .nav-grid .col-mid{grid-column:7/span 3;position:relative;display:flex;flex-direction:column;gap:8px}
  footer.bottom .nav-grid .col-mid .cap{font-size:12px;letter-spacing:.6px;text-transform:uppercase;line-height:1.2}
  footer.bottom .nav-grid .col-right{grid-column:12/span 4;padding-right:40px;display:flex;flex-direction:column;gap:8px}
  footer.bottom .nav-grid .col-right a:hover{opacity:1}
  

  @media (max-width:900px){
    .cover{min-height:0}
    .cover .nav-bar{padding:18px 24px;grid-template-columns:1fr auto}
    .cover .nav-bar .links{display:none}
    .cover .nav-bar .right > a{display:none!important}
    .cover .nav-bar .right{gap:0}
    .cover-live-link{left:24px;bottom:24px}
    .mob-menu-btn{display:inline-flex!important;align-items:center;justify-content:center;background:var(--green,#5CE65C);border:0;cursor:pointer;padding:10px 14px;border-radius:14px;color:#191919;font-size:0;line-height:1;-webkit-tap-highlight-color:transparent}
    .mob-menu-btn svg{display:block}
    .overview .inner{padding:80px 24px;width:100%}
    .overview .content{display:block}
    .overview .left,.overview .right,.overview p{width:100%;max-width:none}
    .overview .right{display:block;min-height:0}
    .project-summary{grid-template-columns:1fr;gap:14px;width:100%;max-width:none;margin-top:24px}
    .project-summary p{font-size:13px;line-height:1.45}
    .overview .left{margin-bottom:28px}
    .overview p{font-size:28px;line-height:36px}
    .media-container{width:100%;padding:20px}
    .media-stack{gap:20px}
    .more{padding:80px 24px 72px}
    .more h2{font-size:42px;line-height:1.05}
    .more-grid{grid-template-columns:1fr;gap:32px}
    .more-card .caption{grid-template-columns:1fr;gap:6px}
    footer.bottom{padding:40px 0 32px;margin-top:0}
    footer.bottom .nav-grid{grid-template-columns:1fr;gap:18px;padding:24px}
    footer.bottom .nav-grid .col-left,footer.bottom .nav-grid .col-mid,footer.bottom .nav-grid .col-right{grid-column:1/-1;padding:0}
    
    footer.bottom .row1{padding:0 24px 8px}
    .menu-overlay .mo-top{grid-template-columns:1fr 1fr;padding:20px 24px}
    .menu-overlay .mo-top .brand{grid-column:1;padding:0}
    .menu-overlay .mo-top .mid{display:none}
    .menu-overlay .mo-top .close-wrap{grid-column:2;padding:0}
    .menu-overlay .mo-grid{grid-template-columns:1fr;gap:48px;padding:48px 24px}
    .menu-overlay .nav-list,.menu-overlay .mo-side{grid-column:1/-1;padding:0}
    .menu-overlay .nav-list a{font-size:36px;letter-spacing:-.6px}
  }

  .transition{
    z-index:1000;
    background:var(--orange,var(--green,#5CE65C));
    grid-template-columns:repeat(8,1fr);
    place-content:center;
    place-items:center;
    width:100%;
    height:100svh;
    min-height:100dvh;
    display:grid;
    position:fixed;
    inset:0;
    pointer-events:none;
  }
  .transition-block{
    background:var(--orange,var(--green,#5CE65C));
    width:100%;
    height:100%;
    opacity:1;
    transition:opacity .1s linear;
    border-radius:50%;
    transform:scale(1.45);
    transform-origin:center;
  }
  @media (max-width:767px){.transition{grid-template-columns:repeat(6,1fr)}}
  @media (max-width:479px){.transition{grid-template-columns:repeat(4,1fr)}}
  .footer-label{font-size:10px;letter-spacing:.7px;text-transform:uppercase;color:rgba(25,25,25,.48);margin-bottom:10px;display:block}

  .view-btn,.nav-bar .right a{
    position:relative;
    overflow:hidden;
    isolation:isolate;
    transform:none;
    transition:background-color .28s ease,border-color .28s ease,color .28s ease;
  }
  .pill::before,.view-btn::before,.nav-bar .right a::before{
    content:"";
    position:absolute;
    inset:-1px;
    border-radius:inherit;
    pointer-events:none;
    z-index:0;
    opacity:0;
    background:linear-gradient(90deg,rgba(92,230,92,.38),rgba(92,230,92,0)) left/0 100% no-repeat,linear-gradient(270deg,rgba(92,230,92,.38),rgba(92,230,92,0)) right/0 100% no-repeat,linear-gradient(180deg,rgba(92,230,92,.32),rgba(92,230,92,0)) top/100% 0 no-repeat,linear-gradient(0deg,rgba(92,230,92,.32),rgba(92,230,92,0)) bottom/100% 0 no-repeat;
    transition:opacity .38s ease,background-size .68s cubic-bezier(.22,1,.36,1);
  }
  .nav-bar .right a::before:not(.white)::before{
    background:linear-gradient(90deg,rgba(255,255,255,.40),rgba(255,255,255,0)) left/0 100% no-repeat,linear-gradient(270deg,rgba(255,255,255,.40),rgba(255,255,255,0)) right/0 100% no-repeat,linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,0)) top/100% 0 no-repeat,linear-gradient(0deg,rgba(255,255,255,.34),rgba(255,255,255,0)) bottom/100% 0 no-repeat;
  }
  .hero .nav-bar .right a::before.ghost::before,body.error-page a::before{
    background:linear-gradient(90deg,rgba(92,230,92,.38),rgba(92,230,92,0)) left/0 100% no-repeat,linear-gradient(270deg,rgba(92,230,92,.38),rgba(92,230,92,0)) right/0 100% no-repeat,linear-gradient(180deg,rgba(92,230,92,.32),rgba(92,230,92,0)) top/100% 0 no-repeat,linear-gradient(0deg,rgba(92,230,92,.32),rgba(92,230,92,0)) bottom/100% 0 no-repeat;
  }
  .pill:hover::before,.view-btn:hover::before,.nav-bar .right a:hover::before{
    opacity:1;
    background-size:28% 100%,28% 100%,100% 28%,100% 28%;
  }
  .pill > span,.view-btn > span,.nav-bar .right a > span{
    position:relative;
    z-index:1;
  }
  .nav-arrow{display:inline-flex;align-items:center;line-height:1;margin-left:1px;position:relative;z-index:1}
  .nav-arrow svg{display:block;overflow:visible}
  .pixel-frame{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:#0d0d0d}
  .pixel-frame > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .pixel-frame .pixel-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;transform:scale(1.045);opacity:1;transition:opacity .22s cubic-bezier(.16,1,.3,1);pointer-events:none;z-index:3}
  .pixel-frame.is-clear .pixel-layer{opacity:0}

/* GREEN_BUTTON_GRADIENT_START */
.cover .nav-bar .right a,
.menu-overlay .close-btn,
.mob-menu-btn{
  background:var(--orange,var(--green,#5CE65C)) !important;
}
/* GREEN_BUTTON_GRADIENT_END */
