.project-tile{--tile-paper:#edf0e4;--tile-accent:#425940;--tile-line:#42594030;--tile-mark:#dde5d1;isolation:isolate;border:1px solid var(--tile-line);background:var(--tile-paper);border-radius:3px 20px 3px 3px;padding:clamp(26px,3vw,38px);position:relative;box-shadow:0 3px #30221b06}.project-tile[data-project-tone=clay]{--tile-paper:#f7e7db;--tile-accent:#8d4425;--tile-line:#8d442530;--tile-mark:#efd3be}.project-tile[data-project-tone=sand]{--tile-paper:#f4edd8;--tile-accent:#715820;--tile-line:#71582030;--tile-mark:#e9dfb9}.project-tile[data-project-tone=rose]{--tile-paper:#f3e5e2;--tile-accent:#804c51;--tile-line:#804c5130;--tile-mark:#e8d1cf}.project-tile[data-project-tone=slate]{--tile-paper:#e6edec;--tile-accent:#375d62;--tile-line:#375d6230;--tile-mark:#cddfdd}.project-tile:before{content:"";background:var(--tile-accent);width:38px;height:3px;position:absolute;top:-1px;left:28px}.project-tile-top{justify-content:space-between;align-items:center;gap:16px;margin-bottom:30px;display:flex}.project-tile-category{color:var(--tile-accent);align-items:center;gap:8px;font-size:.68rem;font-weight:650;line-height:1.5;display:inline-flex}.project-tile-category:before{content:"";background:currentColor;border-radius:50%;width:5px;height:5px}.project-tile-index{color:var(--tile-accent);opacity:.65;font:500 .7rem/1 monospace}.project-tile-symbol{width:58px;height:68px;color:var(--tile-accent);flex-direction:column;justify-content:center;align-items:center;gap:3px;display:flex;position:absolute;top:74px;right:clamp(26px,3vw,38px)}.project-tile-symbol svg{width:45px;height:45px}.project-tile-symbol>span{letter-spacing:.12em;font:500 .5rem/1 monospace}.project-tile :is(h2,h3){color:#302b24;max-width:calc(100% - 76px);min-height:2.2em;font-size:clamp(1.8rem,2.8vw,2.55rem)}.project-tile :is(.featured-work-copy,.work-card-copy)>p{color:#655d50;max-width:45ch;margin-bottom:28px;font-size:.87rem;line-height:1.75}.project-tile-flow{counter-reset:workflow;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:auto 0 24px;padding:0;list-style:none;display:grid}.project-tile-flow li{color:var(--tile-accent);overflow-wrap:anywhere;counter-increment:workflow;padding-top:22px;font-size:.67rem;line-height:1.5;position:relative}.project-tile-flow li:before{content:"0" counter(workflow);background:var(--tile-paper);z-index:1;padding-right:9px;font:500 .58rem/1 monospace;position:absolute;top:0;left:0}.project-tile-flow li:not(:last-child):after{content:"";border-top:1px solid var(--tile-line);width:calc(100% + 12px);position:absolute;top:4px;left:0}.project-tile .project-tile-action{border-top:1px solid var(--tile-line);color:var(--tile-accent);border-bottom:0;justify-content:space-between;align-items:center;gap:16px;margin-top:0;padding:16px 0 0;font-size:.78rem;display:flex}.project-tile-action>span{border:1px solid var(--tile-line);background:#fffdf84d;border-radius:50%;place-items:center;width:34px;height:34px;font-size:1.15rem;transition:background .2s,color .2s;display:grid}.project-tile :is(.featured-work-live,.work-live-link){color:var(--tile-accent);margin-top:4px;padding-block:12px 0;font-size:.7rem}.project-tile :is(.featured-work-link,.work-card-main):hover :is(h2,h3){text-decoration:none}.project-tile :is(.featured-work-link,.work-card-main):focus-visible{outline-offset:9px}@media (width>=900px){.work-grid>.project-tile:first-child{grid-column:1/-1}.work-grid>.project-tile:first-child .work-card-main{grid-template-columns:1.35fr 1fr;column-gap:60px;display:grid}.work-grid>.project-tile:first-child .project-tile-top{grid-column:1/-1}.work-grid>.project-tile:first-child .work-card-copy{grid-area:2/1}.work-grid>.project-tile:first-child h2{max-width:580px;min-height:0;font-size:clamp(2.7rem,4.8vw,4.2rem)}.work-grid>.project-tile:first-child .project-tile-symbol{border:1px solid var(--tile-line);background:repeating-linear-gradient(0deg,transparent,transparent 19px,var(--tile-line) 20px);border-radius:50%;grid-area:2/2;place-self:center;width:min(100%,260px);height:260px;position:relative;top:auto;right:auto}.work-grid>.project-tile:first-child .project-tile-symbol svg{background:var(--tile-paper);border-radius:12px;width:110px;height:110px;padding:15px}.work-grid>.project-tile:first-child .project-tile-symbol>span{background:var(--tile-paper);padding:8px 12px;font-size:.7rem}}@media (hover:hover){.project-tile:hover{border-color:var(--tile-accent);box-shadow:0 9px 20px #30221b0b}.project-tile :is(.featured-work-link,.work-card-main):hover .project-tile-action>span{color:var(--tile-paper);background:var(--tile-accent)}}@media (width<=640px){.project-tile :is(h2,h3){min-height:0;font-size:clamp(1.7rem,7vw,2.4rem)}.project-tile-flow{gap:9px}.project-tile-symbol{top:70px}}@media (prefers-reduced-motion:reduce){.project-tile-action>span{transition:none}}
