/* ./css/footer.css */

footer {
    background-color: var(--senary-color); /* 팔레트의 가장 어두운 색상 사용 */
    color: var(--text-color); /* 일반 텍스트 색상 */
    padding: 50px 20px; /* 충분한 패딩으로 높이 조정 */
    text-align: center;
    font-size: 1.1rem; /* 텍스트 크기를 1.1배로 설정 */
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 15px; /* 요소 간 간격 */
}

footer p {
    margin: 0;
    font-size: 1rem; /* 기존보다 1.15배 증가 */
    color: var(--text-color); /* 일반 텍스트 색상 */
    line-height: 1.6; /* 충분한 줄 간격 */
    letter-spacing: 0.05rem; /* 글자 간격 조정 */
    font-weight: 300; /* 가벼운 폰트 무게로 고급스러운 느낌 */
}

footer a {
    font-family: 'Pacifico', cursive !important;
    color: var(--primary-color); /* 링크에 가장 밝은 색상 사용 */
    text-decoration: none; /* 기본 밑줄 제거 */
    font-weight: 500; /* 링크 텍스트 굵기 추가 */
    transition: color 0.3s ease; /* 색상 전환 효과 */
}

footer a:hover {
    color: var(--secondary-color); /* 호버 시 다른 색상으로 변경 */
    text-decoration: none; /* 호버 시에도 밑줄 제거 */
}

/* 분할 라인 */
.footer-divider {
    width: 60%;
    height: 1px;
    background-color: var(--secondary-color); /* 분할 라인 색상 */
    opacity: 0.3; /* 투명도 낮춰서 부드러운 라인 */
    margin: 15px 0; /* 위아래 여백 */
}

/* 반응형 스타일 */
@media (max-width: 768px) {
    footer {
        padding: 40px 15px; /* 모바일에서 패딩 조정 */
    }
}

/* 로고 중앙 배치 */
.footer-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-grow: 1; /* 로고가 중앙에 위치하도록 설정 */
}

.footer-logo a {
    display: flex;
    align-items: center;
    color: #fff;
    text-decoration: none;
}

.footer-logo img {
    height: 30px; /* 로고 크기 조정 */
    width: auto;
    margin-right: 8px; /* 로고와 텍스트 사이 간격 */
}

.footer-logo span {
    font-family: 'Pacifico', cursive !important;
    font-size: 1.8rem; /* 로고 텍스트 크기 */
    color: #fff;
    letter-spacing: 0.05rem;
}