/* 전역 폰트: 한글·영문 모두 Pretendard 로 통일 (폼 요소는 상속되지 않으므로 함께 지정) */
html,
body,
button,
input,
select,
textarea,
optgroup {
    font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui,
        "Segoe UI", Roboto, "Helvetica Neue", "Apple SD Gothic Neo", sans-serif;
}

/* 1400px 컨테이너 (중앙 정렬) */
.container-1400 {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 1rem;
}

/* 텍스트 줄임 처리 */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 스크롤바 숨기기 (가로 스크롤 섹션용) */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* 무한 루프 마퀴 (수강후기 / 강사진) */
.marquee {
    overflow: hidden;
}

.marquee-track {
    display: flex;
    width: max-content;
    animation: marquee-scroll var(--marquee-duration, 40s) linear infinite;
}

/* gap 대신 margin-right 사용: 마지막 항목 뒤에도 간격이 있어야 -50% 지점이 정확히 이어짐 */
.marquee-track>* {
    margin-right: 1rem;
}

.marquee:hover .marquee-track {
    animation-play-state: paused;
}

@keyframes marquee-scroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .marquee-track {
        animation: none;
    }
}

/* ===================== 모바일 최적화 ===================== */

/* 우측 하단 플로팅 버튼 (동그란 개별 버튼) */
#quick-menu {
    position: fixed;
    right: 16px;
    bottom: 20px;
    z-index: 50;
}

@media (min-width: 768px) {
    #quick-menu {
        right: 24px;
        bottom: 28px;
    }
}

.qm-btn {
    width: 48px;
    height: 48px;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);
    transition: opacity .25s ease, transform .2s ease, background-color .2s ease, color .2s ease;
}

.qm-btn:hover {
    transform: translateY(-2px);
}

@media (min-width: 768px) {
    .qm-btn {
        width: 52px;
        height: 52px;
    }
}

/* sticky 헤더에 가려지지 않도록 앵커 이동 여백 확보 */
section[id],
[id][data-anchor] {
    scroll-margin-top: 76px;
}

@media (min-width: 1024px) {

    section[id],
    [id][data-anchor] {
        scroll-margin-top: 136px;
    }
}

/* 모바일에서 긴 영문/URL 이 레이아웃을 밀지 않도록 */
@media (max-width: 767px) {

    h1,
    h2,
    h3,
    p,
    td,
    li {
        word-break: keep-all;
        overflow-wrap: anywhere;
    }
}

/* iOS 사파리는 16px 미만 입력창에 포커스하면 화면을 확대해버린다 → 모바일 입력창 최소 16px */
@media (max-width: 767px) {

    input[type="text"],
    input[type="password"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    input[type="search"],
    input[type="url"],
    input[type="date"],
    input[type="datetime-local"],
    select,
    textarea {
        font-size: 16px !important;
    }
}
