.arbor-project{grid-template-columns:1fr 1.45fr;}
.website-preview{display:block;align-self:center;margin:27px 27px 27px 0;background:#fafaf7;color:#27332d;border:1px solid #ffffff50;border-radius:6px;overflow:hidden;text-decoration:none;box-shadow:8px 8px 0 #0004;transform:rotate(1deg);transition:transform .2s,box-shadow .2s;}
.website-preview:hover{transform:rotate(0deg) translateY(-3px);box-shadow:10px 10px 0 #0004;}
.browser-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 13px;font-size:10px;border-bottom:1px solid #d2d8d5;background:#e7ebe8;font-family:Arial,sans-serif;}
.browser-dots{color:#77887d;font-size:9px;letter-spacing:2px;white-space:nowrap;}
.website-preview img{width:100%;height:auto;aspect-ratio:1.44;object-fit:cover;object-position:top;}
.shivurr-project .website-preview{background:#090d10;border-color:#71d7f350;}
.shivurr-project .browser-bar{background:#18232a;color:#dff8ff;border-color:#30414d;}
.shivurr-project .browser-dots{color:#71d7f3;}
.about-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:23px;max-width:330px;}
.about-tags span{font-size:9px;letter-spacing:1px;padding:7px 10px;border:1px solid #1c242460;background:#ded9ce;}
@media(max-width:740px){.arbor-project{grid-template-columns:1fr}.arbor-project .project-copy{padding-right:25px}.arbor-project h3{font-size:38px}.arbor-project p{font-size:15px}.website-preview{margin:0 20px 25px}.browser-bar{font-size:9px;padding:9px}.browser-dots{letter-spacing:1px}.about-tags{margin:18px 0 8px;max-width:none}}

.about-portrait{position:relative;margin:30px 0 0 5px;padding:10px 10px 0;background:#faf7ef;max-width:290px;box-shadow:3px 5px 0 #1c242426;transform:rotate(-2deg)}
.about-portrait:before{content:'';position:absolute;width:95px;height:26px;top:-13px;left:calc(50% - 47px);background:#c9b98bad;transform:rotate(5deg);z-index:1}
.about-portrait img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:center}
.about-portrait figcaption{padding:12px 5px 15px;font-family:'Permanent Marker',cursive;font-size:18px}
@media(max-width:740px){.about-portrait{max-width:270px;margin:28px 0 25px 5px}}

.contact-phone{font-size:18px;font-weight:600;text-underline-offset:4px}.identity a{text-decoration:underline;text-underline-offset:3px}.identity a:hover{color:var(--orange)}
