@font-face{
  font-family:Antonio;
  src:url('../assets/project-antonio.woff2') format('woff2');
  font-display:swap;
  font-weight:100 900}
  :root{
    --background:#1b1c1a;
    --text:#f7f7f2;
    --muted:#c2c3bd;
    --lime:#cdff76;
    --sticky-top:110px;
    --card-gap:110px;
    color-scheme:dark}
    *{
      box-sizing:border-box}
      html{
        scroll-behavior:smooth;
        scroll-padding-top:130px}
        body{
          margin:0;
          background:var(--background);
          color:var(--text);
          font-family:Arial,Helvetica,sans-serif;
          font-size:16px;
          line-height:1.5}
          /* A tiny repeating noise filter adds the grain from the reference. */
          body::before{
            content:"";
            position:fixed;
            inset:0;
            z-index:20;
            pointer-events:none;
            opacity:.12;
            background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.94' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.75' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
            a{
              color:inherit;
              text-decoration:none}
              button{
                font:inherit}
                button,a{
                  -webkit-tap-highlight-color:transparent}
                  a:focus-visible,button:focus-visible{
                    outline:3px solid var(--lime);
                    outline-offset:6px}
                    .skip-link{
                      position:fixed;
                      left:16px;
                      top:-80px;
                      z-index:100;
                      background:var(--lime);
                      color:#171914;
                      padding:12px}
                      .skip-link:focus{
                        top:16px}
                        .floating-nav{
                          position:fixed;
                          z-index:50;
                          top:24px;
                          left:50%;
                          transform:translateX(-50%);
                          display:flex;
                          align-items:center;
                          gap:12px;
                          padding:8px;
                          border-radius:40px;
                          background:#10110ff0;
                          box-shadow:0 4px 24px #0002;
                          backdrop-filter:blur(16px)}
                          .monogram{
                            display:grid;
                            place-items:center;
                            width:38px;
                            height:38px;
                            border-radius:50%;
                            background:#e7e7df;
                            color:#222;
                            font-family:Georgia,serif;
                            font-weight:bold;
                            font-style:italic;
                            font-size:28px;
                            padding-bottom:3px}
                            .availability{
                              font-size:14px;
                              white-space:nowrap;
                              display:flex;
                              align-items:center;
                              gap:9px;
                              padding-right:4px}
                              .availability i{
                                height:6px;
                                width:6px;
                                background:var(--lime);
                                border-radius:50%}
                                .menu-toggle{
                                  border:0;
                                  background:var(--lime);
                                  width:40px;
                                  height:40px;
                                  cursor:pointer;
                                  border-radius:50%;
                                  display:flex;
                                  flex-direction:column;
                                  align-items:center;
                                  justify-content:center;
                                  gap:4px}
                                  .menu-toggle span{
                                    width:13px;
                                    height:2px;
                                    background:#222;
                                    transition:transform .2s}
                                    .menu-toggle[aria-expanded=true] span:first-child{
                                      transform:translateY(3px) rotate(45deg)}
                                      .menu-toggle[aria-expanded=true] span:last-child{
                                        transform:translateY(-3px) rotate(-45deg)}
                                        #navigation{
                                          position:absolute;
                                          top:calc(100% + 10px);
                                          left:0;
                                          right:0;
                                          padding:12px 20px;
                                          background:#10110f;
                                          border:1px solid #ffffff18;
                                          border-radius:20px}
                                          #navigation a{
                                            display:flex;
                                            justify-content:space-between;
                                            padding:13px 0;
                                            font-size:15px}
                                            #navigation a:hover{
                                              color:var(--lime)}
                                              #navigation span{
                                                color:#898b80;
                                                font-size:12px}
                                                .section-width{
                                                  width:min(1120px,calc(100% - 64px));
                                                  margin-inline:auto}
                                                  .work{
                                                    padding-top:210px}
                                                    .section-heading{
                                                      margin-bottom:64px;
                                                      max-width:530px}
                                                      .eyebrow{
                                                        font-size:12px;
                                                        letter-spacing:.12em;
                                                        color:#a7aaa0;
                                                        margin:0 0 20px}
                                                        h1,h2,h3,p{
                                                          margin-top:0}
                                                          h1,h2{
                                                            font-family:Antonio,'Arial Narrow',sans-serif;
                                                            text-transform:uppercase;
                                                            font-weight:650;
                                                            line-height:1.15}
                                                            h1{
                                                              font-size:clamp(38px,4.5vw,56px);
                                                              margin-bottom:22px}
                                                              .section-heading>p:last-child{
                                                                color:var(--muted);
                                                                max-width:440px;
                                                                margin-bottom:0}
                                                                /* All cards share a parent so sticky positioning can overlap them. */
                                                                .project-stack{
                                                                  position:relative;
                                                                  padding-bottom:1px}
                                                                  .project{
                                                                    position:sticky;
                                                                    top:calc(var(--sticky-top) + var(--index)*16px);
                                                                    z-index:calc(var(--index) + 1);
                                                                    height:clamp(370px,45vw,525px);
                                                                    margin-bottom:var(--card-gap);
                                                                    isolation:isolate;
                                                                    overflow:hidden;
                                                                    border-radius:20px;
                                                                    transform:scale(var(--scale,1));
                                                                    transform-origin:center top;
                                                                    will-change:transform;
                                                                    box-shadow:0 -12px 40px #00000012;
                                                                    background:#303b4b}
                                                                    .project:last-child{
                                                                      margin-bottom:0}
                                                                      .project-image,.project-shade{
                                                                        position:absolute;
                                                                        inset:0;
                                                                        width:100%;
                                                                        height:100%;
                                                                        object-fit:cover;
                                                                        z-index:-2}
                                                                        .project-shade{
                                                                          z-index:-1;
                                                                          background:linear-gradient(180deg,#0003,#0002 35%,#0004 65%,#0006)}
                                                                          .project-one .project-image{
                                                                            object-position:center 52%}
                                                                            .project-two{
                                                                              background:#8c4d31}
                                                                              .project-two .project-shade{
                                                                                background:linear-gradient(180deg,#281b1238,#34170725 45%,#1a120c66)}
                                                                                .project-three .project-shade{
                                                                                  background:linear-gradient(180deg,#11202738,#111b2b55 55%,#09122575)}
                                                                                  .project-four .project-image{
                                                                                    filter:hue-rotate(38deg) saturate(.5) brightness(.5);
                                                                                    transform:scale(1.35);
                                                                                    object-position:70% 30%}
                                                                                    .project-four{
                                                                                      background:#121624}
                                                                                      .project-meta{
                                                                                        position:absolute;
                                                                                        top:26px;
                                                                                        left:30px;
                                                                                        right:30px;
                                                                                        display:flex;
                                                                                        justify-content:space-between;
                                                                                        font-size:12px;
                                                                                        letter-spacing:.08em;
                                                                                        color:#ffffffd0}
                                                                                        .project-copy{
                                                                                          position:absolute;
                                                                                          inset:0;
                                                                                          display:flex;
                                                                                          flex-direction:column;
                                                                                          align-items:center;
                                                                                          justify-content:center;
                                                                                          text-align:center;
                                                                                          padding:65px 28px}
                                                                                          .tag{
                                                                                            background:var(--lime);
                                                                                            color:#34451b;
                                                                                            border-radius:30px;
                                                                                            padding:4px 15px;
                                                                                            font-size:14px;
                                                                                            line-height:1.4;
                                                                                            margin-bottom:20px}
                                                                                            .project h2{
                                                                                              font-size:clamp(28px,4.2vw,49px);
                                                                                              margin-bottom:16px;
                                                                                              text-shadow:0 2px 12px #0002}
                                                                                              .project-copy p{
                                                                                                font-size:15px;
                                                                                                line-height:1.5;
                                                                                                color:#f5f5ef;
                                                                                                max-width:560px;
                                                                                                margin-bottom:0;
                                                                                                text-shadow:0 1px 8px #0008}
                                                                                                .project-footnote{
                                                                                                  position:absolute;
                                                                                                  bottom:25px;
                                                                                                  left:30px;
                                                                                                  font-size:12px;
                                                                                                  letter-spacing:.09em;
                                                                                                  color:#ffffffb0}
                                                                                                  .pill-link{
                                                                                                    display:flex;
                                                                                                    align-items:center;
                                                                                                    justify-content:center;
                                                                                                    gap:25px;
                                                                                                    width:fit-content;
                                                                                                    min-height:44px;
                                                                                                    margin:38px auto 0;
                                                                                                    border-radius:40px;
                                                                                                    background:var(--lime);
                                                                                                    color:#283119;
                                                                                                    font-family:Antonio,sans-serif;
                                                                                                    font-weight:650;
                                                                                                    text-transform:uppercase;
                                                                                                    padding:10px 30px;
                                                                                                    font-size:17px;
                                                                                                    transition:background .2s,transform .2s}
                                                                                                    .pill-link:hover{
                                                                                                      background:#dfffaa;
                                                                                                      transform:translateY(-2px)}
                                                                                                      .approach{
                                                                                                        padding-top:210px}
                                                                                                        .approach .section-heading{
                                                                                                          max-width:610px}
                                                                                                          .approach h2{
                                                                                                            font-size:clamp(35px,4.5vw,52px);
                                                                                                            margin-bottom:20px}
                                                                                                            .approach-grid{
                                                                                                              display:grid;
                                                                                                              grid-template-columns:1fr 1fr;
                                                                                                              gap:20px}
                                                                                                              .approach-card{
                                                                                                                padding:35px 36px;
                                                                                                                border-radius:20px;
                                                                                                                background:#30312e}
                                                                                                                .stars{
                                                                                                                  display:block;
                                                                                                                  color:var(--lime);
                                                                                                                  letter-spacing:5px;
                                                                                                                  font-size:22px;
                                                                                                                  margin-bottom:16px}
                                                                                                                  .approach-card h3{
                                                                                                                    font-size:20px;
                                                                                                                    font-weight:500;
                                                                                                                    margin-bottom:12px}
                                                                                                                    .approach-card p{
                                                                                                                      color:#c9cac3;
                                                                                                                      max-width:410px}
                                                                                                                      .small-label{
                                                                                                                        display:block;
                                                                                                                        font-size:12px;
                                                                                                                        letter-spacing:.12em;
                                                                                                                        margin-top:28px;
                                                                                                                        color:#acafa3}
                                                                                                                        .statement-card{
                                                                                                                          border-radius:20px;
                                                                                                                          padding:35px 36px 40px;
                                                                                                                          color:#272c20;
                                                                                                                          min-height:255px}
                                                                                                                          .statement-card>span{
                                                                                                                            font-size:14px;
                                                                                                                            display:block;
                                                                                                                            margin-bottom:30px}
                                                                                                                            .statement-card strong{
                                                                                                                              font-family:Antonio,sans-serif;
                                                                                                                              text-transform:uppercase;
                                                                                                                              font-size:clamp(30px,4vw,47px);
                                                                                                                              line-height:1.2;
                                                                                                                              font-weight:650}
                                                                                                                              .light{
                                                                                                                                background:#f2f2ec}
                                                                                                                                .lime{
                                                                                                                                  background:var(--lime)}
                                                                                                                                  footer{
                                                                                                                                    padding-top:170px;
                                                                                                                                    text-align:center}
                                                                                                                                    footer h2{
                                                                                                                                      font-size:clamp(42px,6vw,72px);
                                                                                                                                      margin-bottom:20px}
                                                                                                                                      footer>p:not(.eyebrow){
                                                                                                                                        max-width:450px;
                                                                                                                                        margin-inline:auto;
                                                                                                                                        color:var(--muted)}
                                                                                                                                        .footer-bottom{
                                                                                                                                          margin-top:100px;
                                                                                                                                          border-top:1px solid #ffffff20;
                                                                                                                                          padding:28px 0;
                                                                                                                                          display:flex;
                                                                                                                                          justify-content:space-between;
                                                                                                                                          font-size:12px;
                                                                                                                                          color:#a7aaa0;
                                                                                                                                          letter-spacing:.08em}
                                                                                                                                          @media(min-width:1500px){
                                                                                                                                            .work{
                                                                                                                                              padding-top:240px}
                                                                                                                                            }
                                                                                                                                            @media(max-width:650px){
                                                                                                                                              :root{
                                                                                                                                                --sticky-top:95px;
                                                                                                                                                --card-gap:65px}
                                                                                                                                                .section-width{
                                                                                                                                                  width:calc(100% - 32px)}
                                                                                                                                                  .floating-nav{
                                                                                                                                                    top:16px}
                                                                                                                                                    .work{
                                                                                                                                                      padding-top:165px}
                                                                                                                                                      .section-heading{
                                                                                                                                                        margin-bottom:38px}
                                                                                                                                                        .eyebrow{
                                                                                                                                                          font-size:12px;
                                                                                                                                                          letter-spacing:.08em}
                                                                                                                                                          .project{
                                                                                                                                                            height:420px;
                                                                                                                                                            border-radius:16px;
                                                                                                                                                            top:calc(var(--sticky-top) + var(--index)*10px)}
                                                                                                                                                            .project-meta{
                                                                                                                                                              top:20px;
                                                                                                                                                              left:20px;
                                                                                                                                                              right:20px;
                                                                                                                                                              font-size:12px}
                                                                                                                                                              .project-copy{
                                                                                                                                                                padding:65px 20px}
                                                                                                                                                                .project h2{
                                                                                                                                                                  font-size:34px;
                                                                                                                                                                  max-width:290px}
                                                                                                                                                                  .project-copy p{
                                                                                                                                                                    font-size:14px}
                                                                                                                                                                    .project-copy br{
                                                                                                                                                                      display:none}
                                                                                                                                                                      .project-footnote{
                                                                                                                                                                        left:20px;
                                                                                                                                                                        bottom:20px;
                                                                                                                                                                        font-size:12px;
                                                                                                                                                                        letter-spacing:.03em}
                                                                                                                                                                        .approach{
                                                                                                                                                                          padding-top:125px}
                                                                                                                                                                          .approach-grid{
                                                                                                                                                                            grid-template-columns:1fr;
                                                                                                                                                                            gap:16px}
                                                                                                                                                                            .approach-card,.statement-card{
                                                                                                                                                                              padding:28px}
                                                                                                                                                                              .statement-card{
                                                                                                                                                                                min-height:220px}
                                                                                                                                                                                footer{
                                                                                                                                                                                  padding-top:110px}
                                                                                                                                                                                  .footer-bottom{
                                                                                                                                                                                    gap:20px;
                                                                                                                                                                                    flex-direction:column;
                                                                                                                                                                                    margin-top:65px}
                                                                                                                                                                                  }
                                                                                                                                                                                  @media(prefers-reduced-motion:reduce){
                                                                                                                                                                                    html{
                                                                                                                                                                                      scroll-behavior:auto}
                                                                                                                                                                                      .project{
                                                                                                                                                                                        position:relative;
                                                                                                                                                                                        top:auto;
                                                                                                                                                                                        transform:none!important;
                                                                                                                                                                                        will-change:auto}
                                                                                                                                                                                        .pill-link,.menu-toggle span{
                                                                                                                                                                                          transition:none}
                                                                                                                                                                                        }
                                                                                                                                                                                        @media(max-height:620px){
                                                                                                                                                                                          .project{
                                                                                                                                                                                            height:360px;
                                                                                                                                                                                            position:relative;
                                                                                                                                                                                            top:auto;
                                                                                                                                                                                            transform:none!important}
                                                                                                                                                                                          }