/* Portfolio navigation and image captions. */
.archive .filter-bar{gap:30px;align-items:center;border:0;margin-bottom:24px;padding-bottom:0}
.archive .filter-options{max-width:none;flex:1;gap:8px 24px}
.archive .filter-options button{border:0;border-radius:0;padding:12px 0;font-size:16px;color:#626262;background:none;position:relative}
.archive .filter-options button.active{color:#111;background:none;font-weight:650}
.archive .filter-options button.active::after{content:'';position:absolute;bottom:3px;left:0;right:0;height:3px;background:#c9f73c;border-radius:2px}
.archive .search-label{max-width:180px}.archive .result-count{font-size:12px;color:#666;margin:22px 0}
.project-tile .project-visual{border-radius:20px;overflow:hidden;isolation:isolate;clip-path:inset(0 round 20px);transform:translateZ(0)}
.project-tile .project-caption{position:absolute;inset:auto 0 0;margin:0;padding:70px 24px 24px;display:block;background:linear-gradient(transparent,rgba(0,0,0,.78));color:#fff;z-index:2;pointer-events:none}
.project-tile .project-caption h3{font-size:clamp(20px,1.6vw,30px);line-height:1.15;font-weight:600}
.project-tile .project-caption>span{display:block;text-align:left;color:#fff;font-size:12px;margin-top:8px}
.collection-item .project-caption>span{display:none}
.project-tile .open-badge{display:none}
.archive[data-current-category="mobil-uygulama"] .project-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));columns:auto;gap:22px}
.archive[data-current-category="mobil-uygulama"] .project-tile{margin:0;width:100%}
.archive[data-current-category="mobil-uygulama"] .project-caption{padding:40px 14px 15px}
.archive[data-current-category="mobil-uygulama"] .project-caption h3{font-size:17px}
/* Compact project cover: copy and artwork share one horizontal opening. */
.project-opening{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:4vw;margin:150px 3.3vw 70px;align-items:center}
.project-opening .page-hero{display:flex;flex-direction:column;align-items:flex-start;gap:26px;padding:30px 0;min-height:0}
.project-opening .page-hero h1{font-size:clamp(40px,4vw,76px);line-height:1.06}
.project-opening .hero-foot{margin:0}.project-opening .hero-foot p{max-width:520px;font-size:clamp(17px,1.2vw,23px)}
.project-opening .case-cover{margin:0;aspect-ratio:1.5;background:#f3f3f3;display:grid;place-items:center;border-radius:24px}
.project-opening .case-cover img{width:100%;height:100%;max-height:550px;object-fit:contain}
.case-gallery.portrait{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));columns:auto;gap:24px;padding:0 3.3vw 90px;align-items:start}
.case-gallery.portrait>.gallery-shot{margin:0;width:100%;border-radius:16px;overflow:hidden;clip-path:inset(0 round 16px)}
/* Full-canvas image view, with no darkened image or surrounding overlay. */
@media(max-width:1100px){.archive .filter-bar{align-items:flex-start;flex-direction:column}.archive .filter-options{gap:6px 20px}.archive[data-current-category="mobil-uygulama"] .project-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.project-opening{gap:30px}.project-opening .page-hero h1{font-size:40px}}
@media(max-width:700px){.project-opening{grid-template-columns:1fr;margin:125px 6vw 45px;gap:15px}.project-opening .page-hero{gap:20px;padding:0}.project-opening .page-hero h1{font-size:38px}.project-opening .case-cover{margin-top:10px}.case-gallery.portrait{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:0 6vw 60px}.archive[data-current-category="mobil-uygulama"] .project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.archive .filter-options{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:8px}.archive .filter-options button{white-space:nowrap;font-size:14px}.project-tile .project-caption{padding:45px 18px 18px}.project-tile .project-caption h3{font-size:20px}}
@media(prefers-reduced-motion:reduce){.project-visual img{transition:none}}

/* Unified UI/UX archive, including mobile applications. */
.archive[data-current-category="arayuz"] .project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));columns:auto;gap:28px}
.archive[data-current-category="arayuz"] .project-grid>.project-tile{width:100%;margin:0}
@media(max-width:1000px){.archive[data-current-category="arayuz"] .project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media(max-width:600px){.archive[data-current-category="arayuz"] .project-grid{grid-template-columns:1fr;gap:22px}}
/* Existing application screens composed into covers for archive-only projects. */
.archive-screen-cover{display:flex;align-items:center;justify-content:center;gap:4%;width:100%;height:100%;min-height:240px;padding:8% 8% 18%;box-sizing:border-box;background:radial-gradient(ellipse at 50% 35%,#344253,#151a22 75%);overflow:hidden;border-radius:inherit}
.project-visual .archive-screen-cover{aspect-ratio:1.5}
.archive-screen-cover img,.project-visual .archive-screen-cover img{position:static;width:28%;height:100%;max-height:290px;object-fit:contain;border-radius:8px;filter:drop-shadow(0 10px 14px #0005);transform:none}
.archive-screen-cover img:nth-child(2){translate:0 -8px}
.case-cover .archive-screen-cover{height:420px;padding-bottom:8%}
@media(max-width:600px){.archive-screen-cover{min-height:200px}.case-cover .archive-screen-cover{height:300px}}

/* Interface covers keep their natural proportions without a surrounding mat. */
.interface-opening .case-cover{background:transparent;aspect-ratio:auto;padding:0;align-self:center;display:block;border-radius:24px;overflow:hidden}
.interface-opening .case-cover>img{display:block;width:100%;height:auto;max-height:none;border-radius:24px;object-fit:contain}

/* Clear archive navigation on every project detail. */
.project-back-row{padding:128px 3.3vw 0}
.project-back{display:inline-flex;align-items:center;gap:12px;padding:13px 21px;border:1px solid #dedede;border-radius:999px;color:#101113;background:#fff;font-size:14px;font-weight:600;text-decoration:none;transition:background .2s,border-color .2s}
.project-back:hover{background:#c9f73c;border-color:#c9f73c}
.project-back:focus-visible{outline:2px solid #101113;outline-offset:4px}
.project-back-row+.project-opening{margin-top:30px}
@media(max-width:700px){.project-back-row{padding:135px 6vw 0}.project-back-row+.project-opening{margin-top:24px}.project-back{font-size:13px;padding:12px 18px}}

/* Fixed dimensions keep gallery zoom controls circular. */
.case-gallery .gallery-shot>span{display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;aspect-ratio:1;padding:0;box-sizing:border-box;border-radius:50%;background:#c9f73c;color:#101113;font-size:20px;line-height:1;flex:none}

.interface-related .project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.interface-related .project-caption h3{font-size:clamp(20px,1.8vw,30px)}
@media(max-width:1000px){.interface-related .project-grid{gap:16px}.interface-related .project-caption{padding:40px 16px 18px}}
@media(max-width:700px){.interface-related .project-grid{grid-template-columns:1fr;gap:24px}}

.project-back{width:46px;height:46px;padding:0;gap:0;border-radius:50%;font-size:24px;line-height:1;box-sizing:border-box}

.project-back{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:46px;height:46px;padding:0;gap:0;line-height:1}.project-back svg{display:block;flex:none;width:22px;height:22px}

/* All project covers use the image's own ratio, without a surrounding mat. */
.project-opening .case-cover,.case-cover{background:transparent;aspect-ratio:auto;padding:0;display:block;align-self:center;border-radius:24px;overflow:hidden}
.project-opening .case-cover>img,.case-cover>img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;border-radius:24px}

@media(min-width:901px){.archive[data-current-category="sosyal-medya"] .project-grid,.case-gallery.social-gallery{display:grid;columns:auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:start}.case-gallery.social-gallery .gallery-shot{width:100%;margin:0;min-width:0}}