/* Shared header: Technology and Showcase */
.portfolio-header{position:fixed;inset:0 0 auto;z-index:50;height:64px;padding:0;display:block;background:rgba(10,10,10,.68);border:0;border-bottom:1px solid rgba(255,255,255,.1);backdrop-filter:blur(40px);-webkit-backdrop-filter:blur(40px);color:#fff;font-family:Pretendard,"Noto Sans KR",sans-serif}
.portfolio-header-inner{max-width:1560px;height:64px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px}
.portfolio-brand{justify-self:start;color:#fff;display:flex;align-items:center;flex:none;text-decoration:none}
.portfolio-brand svg{height:18px;width:auto;display:block}
.portfolio-nav{grid-column:2;display:flex;align-items:stretch;align-self:stretch;gap:32px;letter-spacing:0;font-size:14px;font-weight:500;line-height:20px}
.portfolio-nav a{display:flex;align-items:center;justify-content:center;height:64px;padding:0 4px;border:0;border-bottom:2px solid transparent;border-radius:0;box-sizing:border-box;background:transparent;text-decoration:none;color:rgba(255,255,255,.62);transition:border-color .15s,color .15s;white-space:nowrap}
.portfolio-nav a:hover{background:transparent;color:#fff}
.portfolio-nav a[aria-current="page"]{background:transparent;color:#fff;border-bottom-color:#d9ff43;font-weight:700}
.portfolio-nav a[aria-current="page"]:hover{background:transparent;color:#fff}
.portfolio-header a:focus-visible{outline:2px solid #d9ff43;outline-offset:4px}
.technology-page{padding-top:64px}
.technology-page .portfolio-header{background:#0a0a0a}
@media(min-width:640px){.portfolio-header-inner{padding:0 32px}.portfolio-brand svg{height:20px}}
@media(min-width:1024px){.portfolio-header-inner{padding:0 48px}}
@media(min-width:1280px){.portfolio-header-inner{padding:0 64px}}
@media(max-width:420px){.portfolio-header-inner{gap:10px;padding:0 16px}.portfolio-brand svg{height:11px}.portfolio-nav{font-size:11px;gap:16px}.portfolio-nav a{padding:0 2px}}
@media(prefers-reduced-motion:reduce){.portfolio-nav a{transition:none}}

.portfolio-archive-badge{display:inline-flex;align-items:center;justify-content:center;margin-left:10px;padding:4px 8px;border-radius:6px;background:#d9ff43;color:#0a0a0a;font-family:Pretendard,sans-serif;font-size:11px;font-weight:700;line-height:1.3;letter-spacing:0;white-space:nowrap}@media(max-width:560px){.portfolio-header-inner{grid-template-columns:auto minmax(0,1fr)}.portfolio-nav{justify-self:end}.portfolio-archive-badge{font-size:10px;padding:3px 6px;margin-left:7px}.portfolio-brand svg{height:14px}}@media(max-width:420px){.portfolio-brand svg{height:11px}}

.portfolio-language{grid-column:3;justify-self:end;display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border:1px solid #ffffff40;border-radius:7px;color:#f1eee5;font-size:12px;font-weight:650;line-height:1.3;text-decoration:none;white-space:nowrap}.portfolio-language:hover{background:#ffffff12;border-color:#d9ff43;color:#d9ff43}@media(max-width:560px){.portfolio-header-inner{grid-template-columns:auto minmax(0,1fr) auto;gap:8px}.portfolio-language{font-size:10px;padding:5px 7px}.portfolio-nav{gap:12px}}

/* Keep all three destinations and language control reachable on small screens. */
@media(max-width:760px){.portfolio-archive-badge{display:none}.portfolio-header-inner{grid-template-columns:auto minmax(0,1fr) auto;gap:8px;padding:0 12px}.portfolio-nav{gap:8px;font-size:11px}.portfolio-brand svg{height:12px}.portfolio-language{font-size:10px;padding:5px}.portfolio-nav a{padding:0 2px}}
@media(max-width:360px){.portfolio-nav{gap:5px;font-size:10px}.portfolio-header-inner{padding:0 8px;gap:6px}}
