:root{--text:#1a1a1a;--muted:#555555;--line:#d9d9d9;}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:"Times New Roman",Times,Georgia,serif;color:var(--text);background:#fff;line-height:1.5;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}

/* ---------- Home ---------- */
.hero{max-width:620px;margin:0 auto;padding:64px 26px 30px;text-align:center;}
.bio{width:118px;height:118px;border-radius:50%;object-fit:cover;margin:0 auto 16px;border:1px solid var(--line);}
.hero h1{font-size:2rem;font-weight:400;letter-spacing:0.01em;margin-bottom:12px;}
.intro{font-size:0.98rem;color:#2a2a2a;line-height:1.55;}

.work{max-width:860px;margin:0 auto;padding:14px 26px 64px;}
.section-title{text-align:center;font-size:0.78rem;text-transform:uppercase;letter-spacing:0.16em;color:var(--muted);margin-bottom:20px;}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}

/* image tile with hover-reveal label (home cards + gallery) */
.tile{position:relative;display:block;border-radius:5px;overflow:hidden;}
.tile img{width:100%;display:block;}
.tile .overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:10px;opacity:0;background:rgba(0,0,0,0.5);transition:opacity .25s;pointer-events:none;}
.tile:hover .overlay{opacity:1;}
.tile .overlay span{color:#fff;letter-spacing:0.02em;}
.card img{aspect-ratio:3/2;object-fit:cover;}
.card .overlay span{font-size:1.4rem;}

/* ---------- Project pages ---------- */
.project{max-width:1040px;margin:0 auto;padding:30px 30px 66px;}
.back{font-size:0.85rem;color:var(--muted);display:inline-block;margin-bottom:14px;}
.back:hover{color:var(--text);}
.project h1{text-align:center;font-size:1.95rem;font-weight:400;margin-bottom:18px;}
.front{display:block;margin:0 auto;max-width:600px;max-height:430px;width:auto;height:auto;border:1px solid var(--line);border-radius:5px;cursor:zoom-in;}
.front-sm{max-width:460px;}
.divider{border:0;border-top:1px solid #333;margin:24px 0 4px;}

.cols{display:grid;grid-template-columns:repeat(3,1fr);margin:26px 0 8px;}
.col{padding:0 22px;}
.col + .col{border-left:1px solid var(--line);}
.col h2{text-align:center;font-weight:400;font-size:1.3rem;margin-bottom:13px;}
.col p{font-size:0.9rem;line-height:1.5;margin-bottom:9px;color:#222;}
.col ul{font-size:0.9rem;line-height:1.5;margin:0 0 9px 17px;color:#222;}
.col li{margin-bottom:6px;}
.feature-link{font-size:0.82rem;color:var(--muted);margin-top:12px;}
.feature-link a{text-decoration:underline;}

.gallery-divider{border:0;border-top:1px solid #333;margin:34px 0 0;}
/* 3-column grid: full images, no cropping, no letterbox fillers */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:start;margin-top:22px;}
.gallery .tile{cursor:zoom-in;}
.gallery .tile img{width:100%;height:auto;}

/* ---------- Lightbox ---------- */
#lightbox{position:fixed;inset:0;background:rgba(0,0,0,0.92);display:none;align-items:center;justify-content:center;z-index:100;cursor:zoom-out;padding:24px;}
#lightbox.open{display:flex;}
#lightbox img{max-width:96%;max-height:96%;width:auto;height:auto;object-fit:contain;border-radius:4px;}

/* ---------- Footer ---------- */
.footer{border-top:1px solid var(--line);padding:20px;text-align:center;color:var(--muted);font-size:0.85rem;}
.footer a{color:var(--text);}

@media(max-width:760px){
  .cards{grid-template-columns:1fr;}
  .cols{grid-template-columns:1fr;}
  .col{padding:0;}
  .col + .col{border-left:0;border-top:1px solid var(--line);padding-top:16px;margin-top:14px;}
  .gallery{grid-template-columns:repeat(2,1fr);}
  .hero h1{font-size:1.8rem;}
}
