:root { color-scheme: light; --paper:#faf9f7; --card:#fff; --ink:#18181b; --muted:#66645f; --line:#e4e2dd; --accent:#d6583f; --accent-text:#b9432c; --sans:"DM Sans",system-ui,sans-serif; --serif:"Playfair Display",Georgia,serif; --page-width:1160px; }
* { box-sizing:border-box; }
html { min-width:320px; scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
a { color:inherit; } button { color:inherit; font:inherit; }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.wordmark { display:inline-block; font-weight:700; font-size:1.5rem; line-height:1; text-decoration:none; }
.wordmark span { color:var(--accent); }
.loading-note { color:var(--muted); font-size:.92rem; }

/* Tek sayfa portfolyo */
.home-header { position:sticky; top:0; z-index:10; min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:0 max(1.5rem,calc((100vw - var(--page-width))/2)); background:rgba(250,249,247,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.home-header p { margin:0; color:var(--muted); font:500 1rem/1.3 var(--serif); }
.home-main { width:min(calc(100% - 3rem),var(--page-width)); min-height:70vh; margin:0 auto; }
.home-main > .loading-note { padding:2rem 0; }
.portfolio { display:grid; gap:clamp(3.5rem,7vw,6rem); padding:clamp(2rem,5vw,4rem) 0 5rem; }
.category-section > h1 { margin:0 0 2rem; font:500 clamp(2rem,4vw,3rem)/1.1 var(--serif); }
.category-section + .category-section { border-top:1px solid var(--line); padding-top:clamp(2.5rem,5vw,4rem); }

.projects { display:grid; gap:clamp(3rem,6vw,5rem); padding-bottom:5rem; }
.project { padding-top:1.4rem; border-top:1px solid var(--line); }
.project-heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.1rem; }
.project-heading h2 { margin:0; font:500 clamp(1.5rem,3vw,2rem)/1.2 var(--serif); }
.heading-side { display:flex; align-items:center; gap:.9rem; }
.heading-side p { margin:0; color:var(--muted); font-size:.82rem; white-space:nowrap; }
.project-strip { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); grid-template-rows:minmax(0,1fr); gap:.65rem; aspect-ratio:2.2/1; }
.project-strip[data-count="1"] { grid-template-columns:minmax(0,1fr); aspect-ratio:16/9; }
.project-thumbnails { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:.65rem; min-width:0; min-height:0; }
.project-thumbnails[data-count="1"] { grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr); justify-items:center; align-items:center; }
.project-thumbnails[data-count="2"] { grid-template-columns:minmax(0,1fr); }
.project-thumbnails[data-count="3"] .project-photo:last-child { grid-column:span 2; }
.photo-button { position:relative; display:block; min-width:0; width:100%; padding:0; overflow:hidden; border:0; border-radius:6px; background:#ecebe7; cursor:zoom-in; }
.photo-button img { display:block; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .4s,transform .5s; }
.photo-button img.loaded { opacity:1; }
.expand-badge { position:absolute; right:.6rem; bottom:.6rem; width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.92); font-size:.95rem; box-shadow:0 1px 6px rgba(0,0,0,.2); pointer-events:none; }
@media (hover:hover) { .photo-button:hover img { transform:scale(1.03); } .project-cover:hover img { transform:none; } .expand-badge { opacity:0; transition:opacity .2s; } .photo-button:hover .expand-badge, .photo-button:focus-visible .expand-badge { opacity:1; } }
.project-cover { aspect-ratio:auto; }
.project-photo img { position:absolute; inset:0; }
.project-thumbnails[data-count="1"] .project-photo { width:min(100%, min(40vh, 24rem)); height:auto; aspect-ratio:1; }
.cover-fill { position:absolute; inset:-8%; background-position:center; background-size:cover; filter:blur(18px); opacity:.72; transform:scale(1.08); }
.project-cover img { z-index:1; object-fit:contain; }
.project-cover .expand-badge { z-index:2; }
.project-thumbnails .project-photo { height:100%; min-height:0; }
.more-badge { position:absolute; inset:0; display:grid; place-items:center; background:rgba(16,16,17,.58); color:#fff; font-size:clamp(1.2rem,3vw,2rem); font-weight:600; }
.mobile-more { display:none; }
.site-footer { border-top:1px solid var(--line); padding:1.5rem; text-align:center; color:var(--muted); font-size:.78rem; }

/* Lightbox */
.lightbox { position:fixed; z-index:20; inset:0; display:flex; align-items:center; justify-content:center; padding:4rem 5rem; background:rgba(14,14,15,.97); }
.lightbox[hidden] { display:none; }
.lightbox figure { max-width:100%; max-height:100%; margin:0; text-align:center; }
.lightbox figure img { display:block; max-width:min(100%,1300px); max-height:calc(100svh - 8rem); margin:0 auto; object-fit:contain; }
.lightbox figcaption { margin-top:.8rem; color:rgba(255,255,255,.75); font-size:.82rem; }
.lightbox-close,.lightbox-arrow { position:absolute; border:0; background:none; color:#fff; cursor:pointer; }
.lightbox-close { top:1.2rem; right:1.5rem; display:flex; align-items:center; gap:.6rem; font-size:.85rem; }
.lightbox-close span { font-size:1.8rem; font-weight:300; }
.lightbox-arrow { top:50%; padding:1rem; font-size:2rem; transform:translateY(-50%); }
.lightbox-arrow.previous { left:1rem; } .lightbox-arrow.next { right:1rem; }

@media (max-width:700px) {
  .home-header { min-height:60px; padding:0 1rem; }
  .home-header p { max-width:17ch; text-align:right; font-size:.85rem; }
  .home-main { width:min(calc(100% - 2rem),var(--page-width)); }
  .project-strip { grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto; gap:.4rem; aspect-ratio:auto; }
  .project-cover { aspect-ratio:16/10; }
  .project-thumbnails,.project-thumbnails[data-count="2"] { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:minmax(0,1fr); gap:.4rem; }
  .project-thumbnails .project-photo,.project-thumbnails[data-count="1"] .project-photo { width:100%; height:auto; aspect-ratio:1; }
  .project-thumbnails .project-photo:nth-child(n+3) { display:none; }
  .desktop-more { display:none; }
  .mobile-more { display:grid; }
  .lightbox { padding:4rem .75rem; } .lightbox-arrow.previous { left:0; } .lightbox-arrow.next { right:0; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition-duration:.01ms !important; } }
