@charset "utf-8";
/* 02. 헤더 · 마우스 / 키보드 서브 메뉴 */
.header {position: fixed;inset: 0 0 auto;z-index: 100;height: var(--header-height);color: #fff;transition: background .3s, color .3s;}
.header > .container {display: flex;align-items: center;justify-content: space-between;height: 100%;}
.logo {position: relative;z-index: 2;display: inline-flex;align-items: center;gap: 1.2rem;flex-shrink: 0;}
.logo_mark {display: block;width: 4.4rem;height: 4.4rem;color: var(--accent);}
.logo_text {font-size: 2.2rem;font-weight: 800;letter-spacing: -.02em;}
.gnb {position: absolute;left: 50%;top: 0;transform: translateX(-50%);}
.gnb_list {display: flex;gap: clamp(2rem, 3.6vw, 7rem);}
.a_1 {display: flex;align-items: center;height: var(--header-height);border-bottom: .3rem solid transparent;font-size: 1.6rem;font-weight: 700;letter-spacing: .08em;white-space: nowrap;transition: border-color .3s;}
.gnb_list > li:hover .a_1, .gnb_list > li:focus-within .a_1 {border-color: var(--accent);}
.gnb_sub {display: none;position: absolute;left: 50%;top: 100%;transform: translateX(-50%);align-items: center;justify-content: center;gap: 6rem;height: 6.5rem;width: max-content;font-size: 1.6rem;}
.gnb_sub a {white-space: nowrap;transition: color .2s;}
.gnb_sub a:hover, .gnb_sub a:focus-visible {color: var(--accent-dark);}
.gnb_list > li:hover .gnb_sub, .gnb_list > li:focus-within .gnb_sub {display: flex;}
.header:has(.gnb_list > li:hover)::after, .header:has(.gnb_list > li:focus-within)::after {content: '';position: absolute;z-index: -1;inset: 100% 0 auto;height: 6.5rem;background: #fff;border-block: .1rem solid #e5e8ec;}
.header.is_scrolled, .header:has(.gnb:hover), .header:has(.gnb:focus-within), .menu_open .header {color: var(--text);background: #fff;}
.header.is_scrolled .logo_mark, .header:has(.gnb:hover) .logo_mark, .header:has(.gnb:focus-within) .logo_mark, .menu_open .logo_mark {color: var(--ink);}
.header_util {display: flex;align-items: center;gap: 2.4rem;font-size: 1.4rem;font-weight: 700;}
.contact_link {display: flex;align-items: center;gap: .8rem;padding: 1rem 2rem;background: var(--accent);color: var(--ink);clip-path: polygon(0 0, calc(100% - 1rem) 0, 100% 1rem, 100% 100%, 1rem 100%, 0 calc(100% - 1rem));transition: background .3s;}
.contact_link:hover {background: #fff;}
.language {position: relative;}
.language summary {cursor: pointer;list-style: none;}
.language summary::-webkit-details-marker {display: none;}
.language summary::after {content: '⌄';margin-left: .8rem;}
.language ul {position: absolute;top: 3rem;left: -1rem;padding: 1rem 1.5rem;background: #fff;color: var(--text);line-height: 2;box-shadow: 0 .4rem 2rem rgba(0, 0, 0, .1);}
.gnb_toggle {display: grid;align-content: center;gap: .8rem;width: 3rem;height: 4.4rem;}
.gnb_toggle span {width: 100%;height: .2rem;background: currentColor;transition: transform .3s;}
.menu_open .gnb_toggle span:first-child {transform: translateY(.5rem) rotate(45deg);}
.menu_open .gnb_toggle span:last-child {transform: translateY(-.5rem) rotate(-45deg);}
/* 03. 전체 메뉴 */
.gnb_panel {position: fixed;inset: var(--header-height) 0 0;z-index: 99;display: grid;grid-template-columns: 36% 1fr;background: #fff;overflow-y: auto;}
.gnb_panel_image {position: relative;background: linear-gradient(135deg, #161c23, #0e1217);overflow: hidden;}
.gnb_panel_image::before {content: '';position: absolute;inset: 0;background-image: linear-gradient(var(--line-dark) .1rem, transparent .1rem), linear-gradient(90deg, var(--line-dark) .1rem, transparent .1rem);background-size: 6rem 6rem;opacity: .6;}
.gnb_panel_image::after {content: 'ROBOTICS';position: absolute;left: 3rem;bottom: 3rem;font-size: 5rem;font-weight: 800;letter-spacing: .1em;color: rgba(255, 196, 0, .9);}
.gnb_panel_content {display: flex;flex-direction: column;justify-content: center;gap: 3.5rem;padding: 5rem 7vw;}
.gnb_group {display: grid;grid-template-columns: 24rem 1fr;gap: 2rem;align-items: baseline;}
.gnb_title {font-size: 3.4rem;font-weight: 800;letter-spacing: .02em;line-height: 1.2;}
.gnb_group ul {display: flex;flex-wrap: wrap;align-items: center;gap: 1rem 2.4rem;color: var(--mute);}
.gnb_group a:hover {color: var(--accent-dark);}
/* 04. 푸터 · 맨 위로 · 진행 막대 */
.footer {position: relative;background: var(--ink);color: rgba(255, 255, 255, .7);}
.footer_top {padding: 2rem 0;border-bottom: .1rem solid var(--line-dark);}
.sns_list {display: flex;justify-content: flex-end;gap: .8rem;}
.sns_list a {display: grid;place-items: center;width: 4.4rem;height: 4.4rem;border: .1rem solid var(--line-dark);font-size: 1.2rem;font-weight: 700;letter-spacing: .04em;transition: background .3s, color .3s, border-color .3s;}
.sns_list a:hover {background: var(--accent);border-color: var(--accent);color: var(--ink);}
.footer_inner {display: flex;align-items: flex-start;gap: 5rem;padding-block: 4rem;}
.footer_logo {flex: 0 0 18rem;color: #fff;}
.footer_logo .logo_mark {color: var(--accent);}
.footer_info {display: flex;flex: 1;gap: 4rem;}
.footer_info dl {display: grid;grid-template-columns: 7.5rem 1fr;align-content: start;gap: 1.8rem 1rem;font-size: 1.5rem;}
.footer_info dt {color: rgba(255, 255, 255, .45);}
.copyright {max-width: 31rem;align-self: flex-end;font-size: 1.3rem;color: rgba(255, 255, 255, .45);}
.btn_top {position: fixed;right: 2.8rem;bottom: 2.8rem;z-index: 50;display: grid;place-items: center;width: 5.2rem;height: 5.2rem;background: var(--accent);color: var(--ink);font-size: 2.3rem;font-weight: 800;clip-path: polygon(0 0, calc(100% - 1.2rem) 0, 100% 1.2rem, 100% 100%, 1.2rem 100%, 0 calc(100% - 1.2rem));visibility: hidden;opacity: 0;transition: opacity .3s, visibility .3s;}
.btn_top.is_visible {visibility: visible;opacity: 1;}
.progress {position: fixed;left: 0;top: 0;z-index: 400;width: 100%;height: .4rem;background: var(--accent);transform-origin: left center;transform: scaleX(0);pointer-events: none;}
/* 05. 공통 스크롤 등장 효과 */
.reveal_ready {opacity: 0;transform: translateY(5rem);transition: opacity .9s var(--ease), transform .9s var(--ease);transition-delay: var(--d, 0s);}
.reveal_ready.is_visible {opacity: 1;transform: none;}
/* 06. 공통 반응형 */
@media (max-width: 1399px) {
.contact_link {display: none;}
.footer_inner {flex-wrap: wrap;}
.copyright {max-width: none;width: 100%;text-align: right;}
.gnb_panel_content {padding: 4rem;}
.gnb_group {grid-template-columns: 1fr;gap: 1rem;}
}
@media (max-width: 1024px) {
:root {--header-height: 8rem;--page-gutter: 4rem;}
.gnb {display: none;}
.gnb_panel {grid-template-columns: 30% 1fr;}
.footer_info {flex-wrap: wrap;}
}
@media (max-width: 768px) {
:root {--header-height: 7rem;--page-gutter: 2rem;}
.header_util {gap: 2rem;}
.logo_mark {width: 3.8rem;height: 3.8rem;}
.logo_text {font-size: 2rem;}
.gnb_panel {display: block;}
.gnb_panel_image {display: none;}
.gnb_panel_content {padding: 3rem 2rem;gap: 2.8rem;}
.gnb_title {font-size: 2.8rem;}
.footer_inner {gap: 3rem;}
.footer_logo {flex-basis: 100%;}
.footer_info {font-size: 1.4rem;gap: 2rem;}
.copyright {text-align: left;font-size: 1.1rem;}
.btn_top {right: 1.5rem;bottom: 1.5rem;width: 4.6rem;height: 4.6rem;}
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {animation-duration: .01ms !important;animation-iteration-count: 1 !important;transition-duration: .01ms !important;scroll-behavior: auto !important;}
.reveal_ready {opacity: 1;transform: none;}
}