:root{--bg:#f2f0eb;--text:#121212;--muted:#6d6a64;--line:#d9d5ce;--panel:#0f0f0f;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;color:var(--text);background:var(--bg);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}.site-header{min-height:78px;padding:0 3vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{text-decoration:none;font-size:20px;font-weight:800;letter-spacing:.14em}nav{display:flex;gap:28px}nav a{text-decoration:none;font-size:13px;letter-spacing:.04em}.hero{min-height:72vh;padding:9vw 3vw 7vw;display:grid;align-content:center;border-bottom:1px solid var(--line)}.eyebrow{margin:0 0 24px;color:var(--muted);text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:700}.hero h1{margin:0;max-width:1050px;font-size:clamp(62px,10vw,155px);line-height:.84;letter-spacing:-.065em;font-weight:500}.intro{max-width:620px;margin:50px 0 0;color:var(--muted);line-height:1.65;font-size:16px}code{font-family:Consolas,Monaco,monospace;font-size:.92em}.work{padding:7vw 3vw 9vw}.section-heading{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:30px}.section-heading h2{margin:0;font-size:clamp(34px,4vw,62px);font-weight:500;letter-spacing:-.045em}.section-heading p{margin:0;color:var(--muted);font-size:13px}.gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.gallery-item{grid-column:span 4;display:block;position:relative;padding:0;border:0;background:transparent;text-align:left;cursor:zoom-in;overflow:hidden}.gallery-item:nth-child(1),.gallery-item:nth-child(6){grid-column:span 8}.gallery-item img{width:100%;aspect-ratio:1.35/1;object-fit:cover;display:block;transition:transform .45s ease}.gallery-item:hover img{transform:scale(1.018)}.project-meta{display:block;padding:15px 2px 26px}.project-meta strong{display:block;font-size:15px;font-weight:600;margin-bottom:6px}.project-meta span{display:block;max-width:560px;color:var(--muted);font-size:12px;line-height:1.5}.about,.contact{min-height:55vh;padding:8vw 3vw;border-top:1px solid var(--line);display:flex;flex-direction:column;justify-content:center}.about h2,.contact h2{max-width:1000px;margin:0;font-size:clamp(42px,6vw,92px);line-height:.98;letter-spacing:-.05em;font-weight:500}.about>p:last-child{max-width:640px;margin:36px 0 0;color:var(--muted);font-size:17px;line-height:1.7}.contact{background:var(--panel);color:var(--white)}.contact .eyebrow{color:#a6a6a6}.contact a{display:inline-block;margin-top:36px;width:fit-content;font-size:18px;text-decoration-thickness:1px;text-underline-offset:6px}footer{padding:22px 3vw;display:flex;justify-content:space-between;background:var(--panel);color:#929292;border-top:1px solid #2b2b2b;text-transform:uppercase;letter-spacing:.12em;font-size:10px}.empty-state{padding:80px 0;color:var(--muted)}.lightbox{position:fixed;inset:0;z-index:1000;display:none;align-items:stretch;justify-content:center;color:#fff}.lightbox.is-open{display:flex}.lightbox-backdrop{position:absolute;inset:0;background:rgba(8,8,8,.97)}.lightbox-content{position:relative;z-index:2;width:min(92vw,1500px);margin:auto;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:36px;align-items:center}.lightbox-image-wrap{min-height:70vh;max-height:88vh;display:flex;justify-content:center;align-items:center}.lightbox-image-wrap img{display:block;max-width:100%;max-height:88vh;object-fit:contain}.lightbox-copy{align-self:end;padding-bottom:2vh}.lightbox-copy h2{margin:8px 0 16px;font-size:30px;line-height:1.05;letter-spacing:-.03em;font-weight:500}.lightbox-copy p{margin:0;color:#aaa;font-size:13px;line-height:1.65}.lightbox-count{text-transform:uppercase;letter-spacing:.12em;font-size:10px!important}.lightbox-close,.lightbox-nav{position:absolute;z-index:4;border:0;background:transparent;color:#fff;cursor:pointer}.lightbox-close{top:20px;right:28px;font-size:42px;line-height:1;font-weight:200}.lightbox-nav{top:50%;transform:translateY(-50%);padding:20px;font-size:34px}.lightbox-prev{left:10px}.lightbox-next{right:10px}body.lightbox-open{overflow:hidden}@media(max-width:900px){.gallery-item,.gallery-item:nth-child(1),.gallery-item:nth-child(6){grid-column:span 6}.lightbox-content{width:88vw;grid-template-columns:1fr;gap:18px;align-content:center}.lightbox-image-wrap{min-height:0;max-height:68vh}.lightbox-image-wrap img{max-height:68vh}.lightbox-copy{padding:0 44px 0 0}.lightbox-copy h2{font-size:24px}}@media(max-width:620px){.site-header{min-height:66px}nav{gap:16px}nav a:nth-child(2){display:none}.hero{min-height:67vh;padding-top:18vw;padding-bottom:14vw}.hero h1{font-size:clamp(56px,20vw,100px)}.intro{margin-top:32px}.work{padding-top:15vw}.gallery{display:block}.gallery-item{width:100%;margin-bottom:12px}.gallery-item img{aspect-ratio:1.2/1}.project-meta{padding-bottom:30px}.lightbox-nav{top:auto;bottom:16px;transform:none;font-size:26px}.lightbox-prev{left:12px}.lightbox-next{right:12px}.lightbox-close{top:10px;right:15px}.lightbox-copy{padding-right:0;padding-bottom:50px}}


/* =========================================================
   PORTFOLIO GRID
   Equal-height image tiles with title overlay.
   Full captions remain available in the lightbox.
   ========================================================= */

.gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.gallery-item,
.gallery-item:nth-child(1),
.gallery-item:nth-child(6) {
    position: relative;
    display: block;
    width: 100%;
    grid-column: auto;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #111;
}

.gallery-item img,
.gallery-item:nth-child(1) img,
.gallery-item:nth-child(6) img {
    width: 100%;
    aspect-ratio: 4 / 3;
    height: auto;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}

.gallery-item:hover img {
    transform: scale(1.025);
}

.project-meta {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    padding: 14px 16px;
    background: rgba(0, 0, 0, .82);
    color: #fff;
    pointer-events: none;
}

.project-meta strong {
    display: block;
    margin: 0;
    color: #fff;
    font-size: 14px;
    line-height: 1.3;
    font-weight: 600;
    letter-spacing: .01em;
}

.project-meta span {
    display: none;
}

@media (max-width: 900px) {
    .gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .gallery {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .gallery-item img,
    .gallery-item:nth-child(1) img,
    .gallery-item:nth-child(6) img {
        aspect-ratio: 4 / 3;
    }
}