/* ==================================================================
   STOFARM WIDE REFRESH 2026-07
   최종 로드 오버라이드 — PC(넓고 시원하게) + 모바일/PWA(선명하게)
   문제 해결: ① 흐릿한 저대비 텍스트 ② 메뉴 두 줄 래핑
             ③ 좁은 컨테이너/답답한 간격 ④ 플로팅 버튼 3개 겹침
   ================================================================== */

/* ---------- 1) 타이포그래피 — 크고 진하게 ---------- */
html { font-size: 17px; }
@media (max-width: 768px) { html { font-size: 16px; } }

body {
    font-family: 'Pretendard Variable', Pretendard, 'Noto Sans KR', -apple-system, BlinkMacSystemFont, sans-serif !important;
    color: #16241b;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

:root {
    --text-color: #16241b;
    --text-light: #3d5244;
    --text-muted: #5a6f60;
}

/* ---------- 2) 넓은 레이아웃 ---------- */
.container { max-width: 1380px; padding: 0 36px; }
@media (max-width: 768px) { .container { padding: 0 20px; } }

@media (min-width: 1024px) {
    .ag-section { padding: 120px 0; }
    .section { padding: 100px 0; }
    .ag-section-head { max-width: 860px; margin-bottom: 64px; }
    .section-header { margin-bottom: 56px; }
    .ag-stats { gap: 24px; }
    .sfgov-grid { gap: 22px; }
    .sftrack-grid { gap: 26px; }
    .features-grid, .cost-grid, .equipment-grid { gap: 24px; }
    .ag-cases { gap: 24px; }
    .ag-bars { gap: 28px; }
}

/* ---------- 3) 섹션 헤딩 — 시원하게 ---------- */
.ag-section-head h2, .section-header h2 {
    font-size: clamp(1.95rem, 1.5vw + 1.3rem, 2.9rem) !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em;
    line-height: 1.22;
    color: #0d2015 !important;
    word-break: keep-all;
}
.ag-section-head p, .section-header p {
    font-size: clamp(1.02rem, 0.3vw + 0.95rem, 1.18rem) !important;
    color: #37503f !important;
    font-weight: 500;
    line-height: 1.7;
    word-break: keep-all;
}
.ag-eyebrow {
    font-size: 0.86rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em;
}
.ag-cite { font-size: 0.84rem !important; color: #55695b !important; }

/* ---------- 4) 헤더/내비 — 한 줄 고정 ---------- */
.site-header { box-shadow: 0 1px 0 rgba(15, 60, 35, 0.08), 0 6px 24px -18px rgba(15, 60, 35, 0.35); }
.header-inner { height: 78px; gap: 16px; flex-wrap: nowrap; }
.logo a { flex-shrink: 0; }
.logo-text { font-size: 1.28rem; font-weight: 800; white-space: nowrap; }
.main-nav { min-width: 0; }
.nav-menu { gap: 0; flex-wrap: nowrap; }
.nav-menu > li > a {
    padding: 10px 11px;
    font-weight: 600;
    font-size: 0.93rem;
    white-space: nowrap;
    color: #21362a;
}
.header-actions { flex-shrink: 0; }
.btn-login, .btn-register { white-space: nowrap; font-weight: 600; }

/* 데스크톱 좁은 폭(769~1199px): 메뉴가 두 줄 되기 전에 햄버거로 전환 */
@media (max-width: 1199px) and (min-width: 769px) {
    .main-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--bg-white);
        box-shadow: var(--shadow-md);
        padding: 20px;
    }
    .main-nav.active { display: block; }
    .nav-menu { flex-direction: column; gap: 5px; }
    .nav-menu > li > a { padding: 12px 15px; font-size: 1.02rem; }
    .has-submenu .submenu {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        background: var(--bg-color);
        margin-top: 5px;
        border-radius: var(--radius-sm);
    }
    .mobile-menu-toggle { display: flex; }
}

/* ---------- 5) 히어로 — 더 크게, 또렷하게 ---------- */
@media (min-width: 1024px) {
    .hero-section.v2-hero { padding: 110px 0 130px !important; }
    .v2-hero .v2-hero-grid { gap: 72px !important; }
}
.v2-hero .v2-hero-text h1 {
    font-size: clamp(2.3rem, 3.4vw + 0.7rem, 3.9rem) !important;
    line-height: 1.14 !important;
}
.v2-hero .v2-hero-text p {
    color: #22382b !important;
    font-size: clamp(1.05rem, 0.4vw + 0.98rem, 1.22rem) !important;
    max-width: 580px !important;
    font-weight: 500 !important;
}
.v2-hero .v2-eyebrow { font-size: 0.9rem !important; }
.v2-hero .v2-hero-stats strong { font-size: 1.7rem !important; }
.v2-hero .v2-hero-stats span { font-size: 0.88rem !important; color: #3d5244 !important; }
.v2-hero .v2-hero-proof .pp-num { font-weight: 800; color: #0e6b35; }
.v2-hero .v2-hero-proof .pp-lbl { color: #3d5244; }

/* ---------- 6) 유리효과 제거·대비 강화 — 카드류 전부 또렷하게 ---------- */
.ag-stat {
    background: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid #dcebe1 !important;
    box-shadow: 0 10px 26px -16px rgba(15, 80, 40, 0.25) !important;
    padding: 32px 26px !important;
}
.ag-stat .num { color: #0e6b35 !important; }
.ag-stat .lbl { color: #1c3526 !important; font-weight: 700 !important; font-size: 1.04rem !important; margin-top: 10px !important; }
.ag-stat .sub { color: #50675a !important; font-size: 0.88rem !important; margin-top: 6px !important; }

.sfgov-card { padding: 24px 22px; }
.sfgov-card h4 { font-size: 1.1rem !important; color: #0d2015 !important; }
.sfgov-card li { font-size: 0.92rem !important; color: #2c4536 !important; }
.sfgov-card li strong { flex: 0 0 38px !important; font-size: 0.82rem !important; }
.sfgov-links a { font-size: 0.9rem !important; padding: 9px 16px !important; }
.sfgov-cta { padding: 30px 34px !important; }
.sfgov-cta-txt strong { font-size: 1.18rem !important; }
.sfgov-cta-txt span { font-size: 0.98rem !important; opacity: 0.95 !important; }

.sftrack-card h4 { font-size: 1.24rem; }
.sftrack-card li { font-size: 0.94rem; color: #2c4536; }
.sftrack-tag { font-size: 0.78rem; }
.sftrack-note { font-size: 1rem; }

.ag-compare .lbl { color: #1c3526 !important; font-weight: 700 !important; }
.ag-compare .v-trad { color: #4d6154 !important; }
.ag-compare .v-smart { color: #0e6b35 !important; font-weight: 700 !important; }

.ag-sub-item .nm { color: #14351f !important; font-weight: 700 !important; font-size: 1.02rem; }
.ag-sub-item .desc { color: #4d6154 !important; font-size: 0.9rem !important; }
.ag-sub-item .amt { color: #0e6b35 !important; font-weight: 800 !important; }

.ag-bar-row .name { color: #1c3526 !important; font-weight: 600 !important; }
.ag-bar-row .val { color: #0e6b35 !important; font-weight: 700 !important; }
.ag-bar-card h4 { color: #0d2015 !important; font-size: 1.12rem !important; }

.ag-case { background: #ffffff !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.ag-case h4 { color: #0d2015 !important; font-size: 1.18rem !important; }
.ag-case .who { color: #3d5244 !important; font-weight: 600 !important; }
.ag-case p { color: #2c4536 !important; font-size: 0.95rem !important; line-height: 1.65; }
.ag-case .num-row .n { color: #0e6b35 !important; font-weight: 800 !important; }
.ag-case .num-row .l { color: #50675a !important; }

.ag-crop .body h5 { color: #0d2015; font-size: 1.06rem; }
.ag-crop .body > div { color: #3d5244 !important; }
.ag-crop .yld b { color: #0e6b35; }

.ag-quote { background: #ffffff !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.ag-quote blockquote { color: #22382b !important; font-size: 1.04rem !important; line-height: 1.75 !important; }
.ag-quote .by { color: #1c3526 !important; font-weight: 700 !important; }
.ag-quote .by span { color: #50675a !important; font-weight: 500 !important; }

.feature-card h3 { color: #0d2015; font-size: 1.16rem; }
.feature-card p { color: #3d5244 !important; font-size: 0.95rem; line-height: 1.65; }
.cost-item h4 { color: #0d2015; font-size: 1.1rem; }
.cost-item .amount { font-weight: 800; color: #0e6b35; }
.cost-item .range { color: #50675a; }

.equipment-card .info h4 { color: #0d2015; font-size: 1.08rem; }
.equipment-card .info p { color: #3d5244; font-size: 0.92rem; }

.v2-gallery-cap strong { font-size: 1.02rem; }
.v2-gallery-cap span { font-size: 0.86rem; opacity: 0.95; }

.v2-cat-card .title { color: #0d2015; font-weight: 700; }
.v2-cat-card .count { color: #50675a; }

.step-content h4 { color: #0d2015; font-size: 1.06rem; }
.step-content p { color: #3d5244 !important; font-size: 0.9rem; }

.faq-question h4 { font-size: 1.05rem !important; font-weight: 600 !important; color: #16241b; }
.faq-answer p { color: #33493c !important; font-size: 0.98rem; }

.sfconsult-body p, .sfconsult-list li { color: #2c4536; }

/* 푸터 대비 */
.site-footer .footer-desc, .site-footer li a, .site-footer .footer-info, .site-footer .copyright { opacity: 1; }

/* ---------- 7) 플로팅 버튼 정리 — 겹침 제거 ---------- */
/* 구형 '빠른 상담' 원형 버튼 제거(지원사업 상담 FAB와 중복) */
.quick-contact { display: none !important; }
/* 데스크톱: 상담 FAB 하단, 견적 FAB 그 위 */
.sfq-fab { right: 24px !important; bottom: 24px !important; }
@media (min-width: 769px) {
    .v2-fab { right: 24px !important; bottom: 82px !important; }
}
/* 모바일: 하단 내비(72px) 위로 상담 → 견적 순서 스택 */
@media (max-width: 768px) {
    .sfq-fab { right: 14px !important; bottom: 86px !important; }
    .v2-fab { right: 14px !important; bottom: 140px !important; padding: 10px 14px; font-size: 13px; }
}

/* ---------- 8) 모바일/PWA 폴리시 ---------- */
@media (max-width: 768px) {
    .ag-section { padding: 64px 0 !important; }
    .section { padding: 56px 0 !important; }
    .ag-section-head { margin-bottom: 34px; }
    .ag-section-head h2, .section-header h2 { font-size: 1.6rem !important; }
    .ag-section-head p, .section-header p { font-size: 0.98rem !important; }

    .hero-section.v2-hero { padding: 56px 0 72px !important; }
    .v2-hero .v2-hero-text h1 { font-size: 2rem !important; }
    .v2-hero .v2-hero-stats > * { flex: 1 1 calc(50% - 8px); }

    .header-inner { height: 62px; }
    .logo img { width: 34px; height: 34px; }
    .logo-text { font-size: 1.12rem; }

    .sfgov-cta { padding: 22px 20px !important; }
    .sftrack-card .body { padding: 16px 16px 18px; }
    .sfconsult { gap: 18px; }

    /* 하단 내비 — 더 선명하게 */
    .v2-bottom-nav { background: rgba(255, 255, 255, 0.97); box-shadow: 0 -6px 24px -18px rgba(15, 60, 35, 0.5); }
    .v2-bottom-nav a { font-size: 11.5px; font-weight: 600; color: #44584b; }
}

/* 가로 스크롤 방지 (clip은 스크롤 컨테이너를 만들지 않아 sticky 헤더 안전) */
body { overflow-x: clip; }

/* ==================================================================
   9) 다크모드 전면 차단 — 라이트 테마 강제
   mobile-v2.css의 반쪽 다크모드(배경만 어두워지고 본문 글자는 진한색 유지)가
   "어두운 배경 + 어두운 글씨" 사고의 원인. 사이트 전체를 밝게 고정한다.
   ================================================================== */
:root { color-scheme: light; }
@media (prefers-color-scheme: dark) {
    body { background: #FAFAFA !important; color: #16241b !important; }
    .site-header { background: #ffffff !important; border-bottom-color: rgba(15, 60, 35, 0.08) !important; }
    .site-header .main-nav a { color: #21362a !important; }
    .site-header .logo-text { color: var(--primary-color) !important; }
    .section-light { background: linear-gradient(180deg, #F8FAFC 0%, #F0FDF4 100%) !important; }
    .feature-card, .cost-item, .learn-step {
        background: #ffffff !important;
        border-color: #E2E8F0 !important;
        color: #16241b !important;
    }
    .feature-card h3, .cost-item h4, .learn-step h3 { color: #0d2015 !important; }
    .feature-card p, .cost-item .range { color: #3d5244 !important; }
    .v2-bottom-nav { background: rgba(255, 255, 255, 0.97) !important; border-top-color: #E2E8F0 !important; }
    .v2-bottom-nav a { color: #44584b !important; }
    .v2-bottom-nav a.active { color: #14532D !important; }
    .v2-cat-card { background: #ffffff !important; border-color: #E2E8F0 !important; color: #16241b !important; }
    .v2-cat-card:hover { background: #f6fbf3 !important; }
    .v2-cat-card .title { color: #0d2015 !important; }
    .v2-cat-card .count { color: #50675a !important; }
    .learn-step ul.related li a { background: #ffffff !important; border-color: #E2E8F0 !important; color: #16241b !important; }
}

/* ---------- 10) 어두운 배경 위 글자 — 흰색 확실하게 ---------- */
.sfgov-cta, .sfgov-cta-txt strong, .sfgov-cta-txt span { color: #ffffff; }
.ag-cta h2, .ag-cta p { color: #ffffff !important; }
.ag-cta p { opacity: 0.96 !important; }
.site-footer { color: #cfe0d5; }
.site-footer h4 { color: #ffffff; }
.site-footer a { color: #d9e8de; }
.site-footer a:hover { color: #ffffff; }
.site-footer .footer-desc { color: #c2d6c9; }
.site-footer .footer-info, .site-footer .copyright { color: #a8bfb0; }