/* 원본 index.html <style> 그대로 옮김 (디자인 수정 금지) */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&display=swap');

html, body {
    font-family: 'Noto Sans KR', sans-serif;
    background-color: #ffffff;
    color: #1a1a1a;
    overflow-x: hidden;
    width: 100%;
    position: relative;
    word-break: keep-all;
}

.text-primary { color: #000437; }
.bg-primary { background-color: #000437; }
.border-primary { border-color: #000437; }
.text-secondary { color: #2d4b8d; }
.bg-secondary { background-color: #2d4b8d; }
.bg-point { background-color: #466ab8; }

.bubble {
    position: relative;
    padding: 20px 25px;
    border-radius: 20px;
    margin-bottom: 20px;
    max-width: 85%;
    font-weight: 500;
    line-height: 1.6;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}
.bubble-left {
    background: #f1f5f9;
    color: #334155;
    align-self: flex-start;
    border-bottom-left-radius: 2px;
}
.bubble-right {
    background: #164fd2;
    color: #ffffff;
    align-self: flex-end;
    border-bottom-right-radius: 2px;
}

.btn-gold {
    background: linear-gradient(90deg, #D4AF37 0%, #F9E29C 50%, #B8860B 100%);
    color: #1a1a1a;
    font-weight: 700;
}

section { padding: 100px 0; overflow: hidden; width: 100%; }
@media (max-width: 768px) {
    section { padding: 60px 0; }
    body { padding-bottom: 60px; } 
}

.section-subtitle {
    display: inline-block;
    font-size: 0.85rem;
    font-weight: 900;
    letter-spacing: 0.2em;
    margin-bottom: 1.25rem;
    padding: 6px 16px;
    border-radius: 50px;
    background-color: #f1f5f9;
    color: #b8860b;
    text-transform: uppercase;
    border: 1px solid #e2e8f0;
}

.service-card {
    position: relative;
    overflow: hidden;
    z-index: 1;
    background-image: none !important;
}

.service-card::after {
    content: '';
    position: absolute;
    width: 140px; 
    height: 140px;
    bottom: 10px;
    right: 10px;
    
    /* background-image: var(--card-bg-image) 는 template.html <style>에 있음 (url이 css/ 기준으로 풀리는 문제) */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    
    opacity: 0.12; 
    filter: blur(0.5px); 
    
    z-index: -1;
    pointer-events: none;
    transition: all 0.3s ease;
}

.service-card:hover::after {
    opacity: 0.2;
    transform: scale(1.1);
}

.faq-answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease;
    overflow: hidden;
}

.faq-item.active .faq-answer {
    grid-template-rows: 1fr;
    max-height: none;
}

.faq-answer-inner {
    min-height: 0;
    padding-bottom: 0;
    transition: padding 0.3s ease;
}

.faq-item.active .faq-answer-inner {
    padding-bottom: 20px;
}

.floating-bar { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 1000; display: flex; height: 60px; box-shadow: 0 -4px 15px rgba(0,0,0,0.15); }
.floating-btn { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; text-decoration: none; }
.pc-floating-side { position: fixed; right: 30px; bottom: 40px; display: flex; flex-direction: column; gap: 15px; z-index: 100; }
.pc-side-btn { width: 65px; height: 65px; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; color: white; box-shadow: 0 4px 15px rgba(0,0,0,0.2); transition: all 0.3s ease; }

/* ── 이전(Cloudflare) 후 추가 ── */
/* 성공사례: 페이지 밖 항목 숨김 (js/main.js가 페이지 전환) */
.success-item[hidden] { display: none; }
/* 스팸 방지용 숨은 입력칸 (사람에게는 안 보임) */
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }