:root {
    --main-gold: #EAB308;
    /* 폰트 변수 설정 */
    --font-main: 'Pretendard Variable', Pretendard, 'Nanum Gothic', sans-serif;
}

body {
    font-family: var(--font-main);
    padding-top: 62px !important;
    overflow-x: hidden;
    line-height: 1.6; /* 가독성을 위해 줄간격 살짝 추가 */
}

/* 제목 부분만 더 굵게 강조하고 싶을 때 */
h1, h2, h3, h4, h5, h6, .navbar-brand {
    font-family: var(--font-main);
    font-weight: 700;
}

/* (옵션) 나눔고딕만 따로 쓰고 싶은 특정 요소가 있다면 */
.only-nanum {
    font-family: 'Nanum Gothic', sans-serif;
}

html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    /* 가로 스크롤 방지: 우측 흰 공간의 근본 원인 차단 */
    overflow-x: hidden; 
}

body {
    padding-top: 56px;
    overflow-x: hidden;
}

@supports (padding-top: env(safe-area-inset-top)) {
    body {
        padding-top: calc(56px + env(safe-area-inset-top)) !important;
    }
}

.container-fluid {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Navbar */
.navbar.fixed-top { background-color: #1f2937 !important; z-index: 2000; }

/* 2. 내비바 너비 및 위치 고정 */
.navbar.fixed-top {
    background-color: #1f2937 !important;
    z-index: 2000;
    width: 100% !important; /* vw 대신 % 사용 */
    left: 0;
    right: 0;
    border: none;
    /* 내비바 자체 마진 제거 */
    margin: 0 !important;
}

/* Hero */
.hero {
    margin-top: 0 !important;
    background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.75)), url('img/hero1.webp') center/cover no-repeat;
    background-size: cover;
    background-position: center;
    min-height: 60vh;
    color: white;
    width: 100%;
}

/* Carousel Image fit - PC에서 3개씩, 모바일에서 1개씩 */
#carCarousel {
    max-width: 100%;
    margin: 0 auto;
}

#carCarousel .carousel-inner {
    position: relative;
    width: 100%;
}

#carCarousel .carousel-item {
    width: 100%;
}

#carCarousel .carousel-item img {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
    aspect-ratio: 3 / 4;
}

/* PC 화면에서 3개씩 보이도록 */
@media (min-width: 992px) {
    #carCarousel .carousel-item img {
        border-radius: 8px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    }
}

/* 모바일에서는 1개씩 */
@media (max-width: 991px) {
    #carCarousel .carousel-item .col-lg-4:not(:first-child) {
        display: none;
    }
    
    #carCarousel .carousel-item .col-lg-4:first-child {
        max-width: 500px;
        margin: 0 auto;
    }
}

/* Fixed CTA - 모바일에서만 표시 */
.fixed-cta {
    position: fixed;
    left: 0; right: 0;
    bottom: calc(15px + env(safe-area-inset-bottom, 0));
    z-index: 1000;
    display: flex;
    justify-content: center;
    transition: all 0.3s ease-in-out;
}
.fixed-cta .btn { width: 90%; max-width: 400px; border-radius: 50px; padding: 12px; font-weight: bold; box-shadow: 0 4px 15px rgba(0,0,0,0.3); }

/* PC 화면에서는 고정 버튼 숨김 */
@media (min-width: 992px) {
    .fixed-cta {
        display: none !important;
    }
}

/* Fixed Form PC - PC에서만 하단 고정 */
.fixed-form-pc {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    background: transparent;
    transition: all 0.3s ease-in-out;
}

.fixed-form-pc .bg-dark {
    color: white;
}

/* Form 섹션에 도달하면 하단 고정 Form 숨김 */
body.form-active .fixed-form-pc {
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
}

/* TOP Button */
.top-btn {
    position: fixed;
    right: 20px;
    bottom: 90px;
    width: 50px; height: 50px;
    z-index: 1000;
    transition: all 0.3s ease-in-out;
}

/* Animation States */
body.form-active #fixedCta { opacity: 0; visibility: hidden; transform: translateY(20px); }
body.form-active .top-btn { bottom: calc(15px + env(safe-area-inset-bottom, 0)); }

/* 통계 카드 스타일 */
.stat-card {
    transition: transform 0.3s ease;
}

.stat-card:hover {
    transform: translateY(-5px);
}

/* PC 화면에서 통계 박스 크게 */
@media (min-width: 992px) {
    .stat-card .card-body {
        padding: 3rem 2rem !important;
    }
    
    .stat-number {
        font-size: 4rem !important;
    }
    
    .stat-card p {
        font-size: 1.25rem !important;
    }
}

/* 폼 컨트롤 스타일 */
.form-control:focus { box-shadow: none; border-color: var(--main-gold) !important; }

/* Placeholder 색상 화이트로 변경 */
.form-control::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
    opacity: 1;
}

.form-control::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.form-control::-moz-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.form-control:-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}