/* GAC LAB Official Stylesheet
    Theme: Deep Navy & Emerald Innovation
*/
/* 기본적으로 언어 텍스트 숨김 */
.lang-ko, .lang-en {
    display: none;
}

/* body 클래스에 따른 노출 제어 */
body.ko .lang-ko { display: block; }
body.en .lang-en { display: block; }

/* 인라인 요소(span 등)의 경우 */
body.ko span.lang-ko { display: inline; }
body.en span.lang-en { display: inline; }
/* 1. 기본 초기화, 폰트 및 공통 스타일 (유지됨) */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Pretendard', 'Malgun Gothic', sans-serif;
    background-color: #f1f5f9;
    color: #334155;
    line-height: 1.7;
}

/* 2. 헤더 및 네비게이션 */
header {
    background: #ffffff; /* 흰색 배경 유지 */
    padding: 0.2rem 0;
    position: sticky;
    top: 0;
    z-index: 1000;
    border-bottom: 1px solid rgba(16, 185, 129, 0.2);
}

nav {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
}

/* [최적화/변경] 통합 로고 컨테이너 */
.logo-container {
    display: flex;
    align-items: center;
}

/* [핵심] 하이브리드 로고 디자인: 이미지와 텍스트가 함께 들어있는 링크에 Transition 적용 */
.logo-container a {
    display: flex;
    align-items: center;
    gap: 20px; /* 이미지와 텍스트 간격 */
    text-decoration: none;
    transition: opacity 0.3s ease;
}

/* 마우스를 올렸을 때 효과 (Hover Effect) */
.logo-container a:hover {
    opacity: 0.8; /* 전체 로고가 살짝 투명해짐 */
}

/* [사용/복원] 전자상거래 박사(Ph.D.) 전문성을 상징하는 Emerald 텍스트 브랜드 스타일 */
.logo {
    /* 기존 1.6rem에서 약 3배인 4rem으로 확대 */
    font-size: 4rem; 
    font-weight: 800;
    color: #10b981; /* 지에이씨랩의 에메랄드 그린 */
    letter-spacing: -2px; /* */
    text-transform: uppercase;
    display: inline-block;
    vertical-align: middle;
}

/* [사용/최적화] 배경 이미지 방식으로 로고 구현 */
.logo-img {
    /* */
    display: inline-block;
    vertical-align: middle;
    /* 로고의 원본 비율(image_0.png)을 고려하여 너비를 50px로 설정 (미세 조정 가능) */
    width: 150px; 
    height: 150px; /* 로고의 세로 크기를 50px로 고정 */
    
    /* 로고 파일 경로 지정 (투명 PNG) */
    background: url('../images/gaclab-logo.png') no-repeat center center/contain;
}

.gac-logo {
    height: 100px; /* 50px * 2 = 100px */
    width: auto; /* 비율 유지를 위해 너비는 자동 */
}

/* 화면이 작아질 때는 자동으로 줄어들게 설정 */
@media (max-width: 768px) {
    header {
        padding: 0.1rem 0 !important; /* 헤더 높이 최소화 */
    }

    nav {
        padding: 0 10px !important;
        gap: 5px !important; /* 로고와 메뉴 사이 간격 최소화 */
    }

    .logo-container a {
        gap: 5px !important; /* 이미지와 텍스트 사이 간격 최소화 */
        flex-shrink: 1; /* 공간 부족 시 로고 영역이 줄어들 수 있도록 설정 */
        min-width: 0; /* flex 자식의 최소 너비 제한 해제 */
    }

    .logo-img {
        /* */
        width: 30px !important; 
        height: 30px !important;
        flex-shrink: 0; /* 이미지가 찌그러지지 않게 보호 */
    }

    .logo {
        /* */
        white-space: nowrap !important; 
        /* */
        font-size: clamp(1rem, 4vw, 1.5rem) !important; 
        letter-spacing: -1px !important;
        font-weight: 800;
    }

    nav ul {
        gap: 8px !important; /* 메뉴 간격 좁힘 */
        flex-shrink: 0;
    }

    nav a {
        /* */
        font-size: 0.75rem !important; 
    }
}


/* --- (기타 메뉴 관련 스타일 유지) --- */
nav ul {
    list-style: none;
    display: flex;
    gap: 30px;
}

nav a {
    color: #020617;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    transition: color 0.3s ease;
}

nav a:hover, nav a.active {
    color: #10b981;
}

/* 3. 히어로 섹션 및 기타 섹션 (유지됨, 불필요한 부분 제거됨) */
.hero { position: relative; height: 400px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: white; background-color: #020617; }
.hero::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to bottom, rgba(2, 6, 23, 0.8), rgba(2, 6, 23, 0.4)); z-index: 1; }
.hero h1, .hero p { position: relative; z-index: 2; }
.hero h1 { font-size: 3rem; margin-bottom: 15px; font-weight: 700; }
.hero p { font-size: 1.1rem; opacity: 0.9; max-width: 700px; }

/* 페이지별 개별 배경 적용 */
.main-hero { background: url('../images/hero-bg.jpg') no-repeat center center/cover; height: 500px; }
.notice-hero { background: url('../images/biz-consulting.jpg') no-repeat center center/cover; }
.post-hero { background: url('../images/post.jpg') no-repeat center center/cover; }
.inquiry-hero { background: url('../images/biz-marketing.jpg') no-repeat center center/cover; }

/* 4. 메인 컨텐츠 컨테이너 (유지됨, h2 깨진 색상 수정됨) */
.container { max-width: 1100px; margin: -60px auto 100px; background: white; padding: 60px; border-radius: 20px; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15); position: relative; z-index: 10; }
h2 { font-size: 2rem; color: #020617; margin-bottom: 30px; }

.business-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; margin-top: 40px; }
.biz-item { background: #fff; padding: 40px; border-radius: 15px; border: 1px solid #e2e8f0; transition: all 0.3s ease; position: relative; overflow: hidden; }
.biz-item::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: #10b981; }
.biz-item:hover { transform: translateY(-10px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); border-color: #10b981; }
.biz-item h3 { font-size: 1.4rem; color: #0f172a; margin-bottom: 20px; font-weight: 700; }
.biz-item ul { list-style: none; padding-left: 0; }
.biz-item ul li { font-size: 0.95rem; color: #475569; margin-bottom: 10px; position: relative; padding-left: 20px; }
.biz-item ul li::before { content: '→'; position: absolute; left: 0; color: #10b981; font-weight: bold; }

/* --- 5. 게시판 및 연락처 (유지됨) --- */
.board-table { width: 100%; border-collapse: separate; border-spacing: 0; margin-top: 20px; }
.board-table th { background-color: #f8fafc; color: #0f172a; font-weight: 600; padding: 18px 15px; border-top: 2px solid #020617; border-bottom: 1px solid #e2e8f0; text-transform: uppercase; font-size: 0.85rem; letter-spacing: 1px; }
.board-table td { padding: 20px 15px; border-bottom: 1px solid #f1f5f9; color: #475569; text-align: center; font-size: 0.95rem; }
.board-table td.subject { text-align: left; font-weight: 500; }
.board-table td.subject a { color: #334155; text-decoration: none; transition: color 0.2s ease; }
.board-table td.subject a:hover { color: #10b981; }
.empty-row td { padding: 50px 0; color: #94a3b8; font-style: italic; }

.contact-card-panel { background: #fff; padding: 50px; border-radius: 12px; border: 1px solid #e2e8f0; max-width: 650px; margin: 0 auto; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05); }
.contact-form { display: flex; flex-direction: column; gap: 20px; }
.form-group { display: flex; flex-direction: column; gap: 8px; }
.contact-form input, .contact-form select, .contact-form textarea { padding: 15px; border: 1px solid #cbd5e1; border-radius: 6px; background-color: #fff; font-family: inherit; font-size: 0.95rem; }
.contact-form button { background: #10b981; color: white; border: none; padding: 18px; border-radius: 6px; cursor: pointer; font-size: 1.1rem; font-weight: bold; margin-top: 10px; transition: background 0.3s ease; }
.contact-form button:hover { background: #059669; }

/* 6. 푸터 및 스크린 리더 유틸리티 */
footer { text-align: center; padding: 40px 0; border-top: 1px solid #e2e8f0; background: #fff; }
footer p { font-size: 0.9rem; color: #94a3b8; }

/* 스크린 리더용 숨김 텍스트 (웹 접근성 준수) */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* brand.html 전용 내부 추가 스타일 (기존 style.css와 100% 호환) */
        .brand-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 30px;
            margin-top: 40px;
        }
        
        .brand-item {
            background: #fff;
            padding: 40px 30px;
            border-radius: 15px;
            border: 1px solid #e2e8f0;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
        }
        
        .brand-item::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 4px;
            background: #10b981; /* 에메랄드 시그니처 컬러 */
        }
        
        .brand-item:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
            border-color: #10b981;
        }
        
        .brand-item .initial-bg {
            font-size: 5rem;
            font-weight: 900;
            color: #10b981;
            opacity: 0.08;
            position: absolute;
            top: -10px;
            right: 20px;
            pointer-events: none;
        }
        
        .brand-item h3 {
            font-size: 1.8rem;
            color: #020617; /* 딥 네이비 */
            font-weight: 800;
            margin-bottom: 5px;
            letter-spacing: -0.03em;
        }
        
        .brand-item .sub-slogan {
            font-size: 0.95rem;
            font-weight: 600;
            color: #10b981;
            margin-bottom: 25px;
            text-transform: uppercase;
            letter-spacing: 0.05em;
        }
        
        .brand-item p {
            font-size: 0.95rem;
            color: #475569;
            text-align: justify;
            word-break: keep-all;
            line-height: 1.7;
        }
        
        .brand-item .divider {
            height: 1px;
            background: #e2e8f0;
            margin: 20px 0;
        }
        
        .brand-item p.en-desc {
            color: #64748b;
        }