:root{--color-bg: #ffffff;--color-text: #111111;--color-text-n: #374151;--color-text-nd: #1b1f34;--color-text-gd: #343a40;--color-text-gm: #6b7280;--color-text-gs: #9ca3af;--color-text-bs: #f7f8fa;--color-border: #e4e4e4;--color-border-strong: #c8c8c8;--color-surface: #f2f2f2;--color-accent: #111111;--color-accent-hover: #f3f3f3;--color-seoultech-blue: #003c71;--container-width: 1080px;--navbar-width: 1240px;--navbar-z: 1000;--navbar-height: 80px;--transition: .2s;--radius-xs: 6px;--radius-sm: 12px;--radius-md: 16px;--radius-pill: 999px;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--shadow-hover: 0 2px 8px rgba(0, 0, 0, .08);--font-family: "Inter", "Pretendard", "Roboto", sans-serif;--font-size-2xs: .6875rem;--font-size-xs: .75rem;--font-size-sm: .8125rem;--font-size-base: .875rem;--font-size-md: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.5rem;--font-weight-light: 300;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.2;--line-height-snug: 1.4;--line-height-normal: 1.5;--line-height-relaxed: 1.6;--line-height-loose: 1.75;--letter-spacing-normal: 0;--letter-spacing-wide: .04em;--letter-spacing-wider: .08em;--letter-spacing-caps: .12em}h1,h2,h3,h4,h5,h6,p{margin:0}h1{font-size:var(--font-size-4xl);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);color:var(--color-text-bs)}h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);line-height:var(--line-height-snug);color:var(--color-text-n)}h3{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);line-height:var(--line-height-snug);color:var(--color-text-nd)}h4{font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);line-height:var(--line-height-snug);color:var(--color-text-n)}h5{font-size:var(--font-size-md);font-weight:var(--font-weight-medium);line-height:var(--line-height-snug);color:var(--color-text-n)}h6{font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);line-height:var(--line-height-relaxed);letter-spacing:var(--letter-spacing-caps);text-transform:uppercase;color:var(--color-text-gs)}p{font-size:var(--font-size-base);font-weight:var(--font-weight-light);line-height:var(--line-height-loose);color:var(--color-text-gd)}.text-brand{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);line-height:var(--line-height-snug)}.text-nav{font-size:var(--font-size-md);font-weight:var(--font-weight-normal);line-height:var(--line-height-snug)}.text-ui{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);line-height:var(--line-height-snug)}.text-secondary{color:var(--color-text-gs)}*{box-sizing:border-box}body{margin:0;font-family:var(--font-family);background:var(--color-bg);color:var(--color-text);min-height:100vh;display:flex;flex-direction:column}a{color:inherit;text-decoration:none}.navbar{position:fixed;top:0;left:0;width:100%;background:var(--color-bg);z-index:var(--navbar-z);transition:transform .28s ease,background .28s ease,backdrop-filter .28s ease,-webkit-backdrop-filter .28s ease,box-shadow .28s ease}.inner--nav{--inner-width: var(--navbar-width);display:flex;justify-content:space-between;align-items:center}.navbar.nav-hidden{transform:translateY(-100%)}.navbar.nav-scrolled{background:#ffffff1a;backdrop-filter:blur(10px) saturate(110%);-webkit-backdrop-filter:blur(10px) saturate(110%)}.brand{color:var(--color-text);padding:18px 0;white-space:nowrap;display:flex;align-items:center}.brand-logo{height:44px;width:auto;display:block}.nav-hamburger{display:none;background:none;border:none;cursor:pointer;padding:4px 0;color:var(--color-text);width:24px;height:24px;align-items:center;justify-content:center}.hamburger-icon{display:block;position:relative;width:18px;height:2px;background:currentColor;transition:background 0s ease .2s}.hamburger-icon:before,.hamburger-icon:after{content:"";position:absolute;left:0;width:100%;height:2px;background:currentColor;transition:top .2s ease .2s,bottom .2s ease .2s,transform .2s ease}.hamburger-icon:before{top:-6px}.hamburger-icon:after{bottom:-6px}.navbar.nav-open .hamburger-icon{background:transparent;transition:background 0s}.navbar.nav-open .hamburger-icon:before,.navbar.nav-open .hamburger-icon:after{transition:top .2s ease,bottom .2s ease,transform .2s ease .2s}.navbar.nav-open .hamburger-icon:before{top:0;transform:rotate(45deg)}.navbar.nav-open .hamburger-icon:after{bottom:0;transform:rotate(-45deg)}.brand:hover{color:#555}.nav-links{display:flex;gap:24px}.nav-links a{color:var(--color-text);padding:18px 0}.nav-links a:hover{color:#555}.nav-links a.active{font-weight:700;color:var(--color-text)}@media (max-width: 768px){:root{--navbar-height: 70px}.inner--nav{flex-wrap:wrap}.brand{padding:16px 0}.brand-logo{height:38px}.nav-hamburger{display:flex;align-items:center;justify-content:center}.nav-links{display:flex;overflow:hidden;max-height:0;opacity:0;pointer-events:none;width:100%;flex-direction:column;gap:0;padding-bottom:0;transition:max-height .28s ease,opacity .2s ease,padding-bottom .28s ease}.navbar.nav-open .nav-links{max-height:200px;opacity:1;pointer-events:auto;padding-bottom:10px}.nav-links a{width:100%;padding:12px 0}}@media (max-width: 480px){:root{--navbar-height: 64px}.brand-logo{height:32px}}.main{width:min(100% - 32px,var(--container-width));margin:0 auto;display:flex;flex-direction:column;flex:1;padding-top:calc(var(--navbar-height) + clamp(56px,7vw,96px));padding-bottom:clamp(56px,7vw,96px);gap:clamp(48px,6vw,72px)}.section{display:flex;flex-direction:column;gap:24px;scroll-margin-top:80px}.stack{display:flex;flex-direction:column;gap:var(--space-md)}.stack--sm{gap:var(--space-sm)}.split{display:grid;gap:var(--space-lg);align-items:start}.split--46{grid-template-columns:4fr 6fr;align-items:stretch}.split--46>.media img{display:block;width:100%;height:100%;object-fit:cover}.list{display:grid;gap:var(--space-md)}.inner{--inner-width: var(--container-width);width:calc(100% - 32px);max-width:var(--inner-width);margin-inline:auto}.inner--search{--inner-width: 500px;display:flex;flex-direction:column;align-items:center;gap:var(--space-md)}.inner--footer{--inner-width: 960px}@media (max-width: 768px){.split--46{grid-template-columns:1fr}}.footer{width:100%;background:var(--color-seoultech-blue);padding:42px 0 26px;color:#f7f8fac7}.split--footer{grid-template-columns:1fr 1.45fr 1fr;gap:56px}.split--footer>*{min-width:0}.footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:22px}.footer-logo-link{display:inline-flex;align-items:center}.footer-logo{display:block;width:auto;object-fit:contain}.footer-logo--school{height:48px}.footer-logo--lab{height:35px}.footer-heading{margin:0 0 16px;font-size:var(--font-size-sm);line-height:var(--line-height-tight);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-wider);text-transform:uppercase;color:#f7f8faf5}.footer-contact-list{display:flex;flex-direction:column;gap:8px}.footer .meta-row{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:16px;align-items:start}.footer .meta-row__label{font-size:var(--font-size-xs);line-height:var(--line-height-relaxed);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-wide);color:#f7f8fa85}.footer .meta-row__value{min-width:0;font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);color:#f7f8fac7}.footer a{color:#f7f8fad1;text-decoration:none}.footer a:hover{color:#f7f8fa}.footer-nav{display:flex;flex-direction:column;align-items:flex-start;gap:10px}.footer-nav a{font-size:var(--font-size-sm);line-height:var(--line-height-snug)}.footer-divider{height:1px;margin:var(--space-md) 0;background:#f7f8fa3d}.footer-copy{margin:0;text-align:center;font-size:var(--font-size-xs);line-height:var(--line-height-relaxed);color:#f7f8fa9e}@media (max-width: 768px){.footer{padding:36px 0 24px}.split--footer{grid-template-columns:1fr;gap:30px}.footer-brand{align-items:flex-start;gap:18px}.footer-logo--school{height:40px}.footer-logo--lab{height:30px}.footer-heading{margin-bottom:12px;font-size:var(--font-size-xs)}.footer-contact-list{gap:8px}.footer .meta-row{grid-template-columns:68px minmax(0,1fr);column-gap:14px}.footer .meta-row__label{font-size:var(--font-size-xs);text-align:left}.footer .meta-row__value{font-size:var(--font-size-xs);line-height:var(--line-height-relaxed);text-align:left}.footer-nav{align-items:flex-start;gap:8px}.footer-nav a{font-size:var(--font-size-xs)}.footer-copy{font-size:12px;line-height:1.55}}@media (max-width: 480px){.footer{padding:32px 0 22px}.footer-main{gap:26px}.footer-brand{gap:16px}.footer-logo--school{height:32px}.footer-logo--lab{height:24px}.footer-heading{font-size:var(--font-size-xs)}.footer .meta-row{grid-template-columns:62px minmax(0,1fr);column-gap:12px}.footer .meta-row__label,.footer .meta-row__value,.footer-nav a{font-size:var(--font-size-xs)}.footer-copy{max-width:320px;margin:0 auto;font-size:var(--font-size-xs);line-height:var(--line-height-normal)}}.btn{display:inline-flex;align-self:flex-start;align-items:center;justify-content:center;min-height:36px;padding:0 16px;border-radius:var(--radius-pill);border:1px solid var(--color-border);background:transparent;color:var(--color-text-gs);font-family:inherit;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);line-height:var(--line-height-snug);cursor:pointer;text-decoration:none;transition:var(--transition)}.btn:hover{background:var(--color-accent-hover);color:var(--color-text-n);border-color:var(--color-border-strong)}.btn.active{background:#37415114;border-color:transparent;color:var(--color-text-n)}.btn.active:hover{background:#37415124;border-color:transparent;color:var(--color-text-n)}.btn--primary{border:2px solid #7dd3fc;color:#7dd3fc}.btn--primary:hover{background:#7dd3fc;border-color:#7dd3fc;color:var(--color-bg)}.btn--back:hover{transform:translate(-2px)}.group{display:flex;flex-wrap:wrap;gap:var(--space-sm);align-items:center}.tag{display:inline-flex;align-items:center;min-height:20px;padding:0 8px;border-radius:var(--radius-pill);border:1px solid currentColor;font-size:var(--font-size-2xs);font-weight:var(--font-weight-normal);line-height:1;letter-spacing:.04em;white-space:nowrap}.tag--project{color:#eab308;background:#eab3081a}.tag--topic{color:#535982;background:#5359821a}.tag--method{color:#65a30d;background:#65a30d1a}.tag--featured{color:#ea580c;background:#ea580c1a}.card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition)}.card:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow-hover);transform:translateY(-2px)}.card--static{cursor:default}.card--static:hover{border-color:var(--color-border);box-shadow:none;transform:none}.media{overflow:hidden;position:relative;background:var(--color-surface)}.info{display:flex;flex-direction:column;gap:var(--space-sm)}.card .info{gap:var(--space-xs)}.info p a{text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--color-border-strong)}.card--publication{display:flex;flex-direction:column;gap:4px;padding:12px 24px}.card--update{display:flex;flex-direction:column;overflow:hidden;border-radius:var(--radius-md);width:100%}.card--update .media{aspect-ratio:16 / 10}.card--update .info{padding:18px 18px 20px}.card--member{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:var(--space-md);padding:12px 24px;min-height:100px}.card--member .media{width:120px;height:150px;border-radius:var(--radius-sm)}.card--member .media img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}.card--alumni{display:flex;flex-direction:column;gap:var(--space-xs);padding:12px 24px;min-height:100px}.card--recruit{display:flex;flex-direction:column}.card--recruit.is-open,.card--recruit.is-open:hover{border-color:var(--color-seoultech-blue);box-shadow:none;transform:none}.card--recruit__main{display:grid;grid-template-columns:1fr auto;align-items:start;gap:var(--space-md);padding:12px 16px 12px 24px}.card--recruit__content{display:flex;flex-direction:column;gap:4px}.card--recruit__btn{background:none;border:none;cursor:pointer;padding:2px;color:var(--color-text-gm)}.card--recruit__chevron{width:18px;height:18px;display:block;transition:transform .25s ease,color .2s ease}.card--recruit.is-open .card--recruit__chevron{transform:rotate(180deg);color:var(--color-seoultech-blue)}.card--recruit__body{overflow:hidden;max-height:0;transition:max-height .3s ease}.card--recruit.is-open .card--recruit__body{max-height:600px}.card--recruit__body p{padding-top:8px;color:var(--color-text-gs)}
