From ae2831d1ae4661f5e32606d23ae237cf7a817ad9 Mon Sep 17 00:00:00 2001
From: kimbokon <lightone2017@gmail.com>
Date: Thu, 1 Jan 2026 20:45:48 +0900
Subject: [PATCH] =?UTF-8?q?=EC=9E=90=EB=8F=99=EB=B0=A9=ED=99=94=EC=85=94?=
 =?UTF-8?q?=ED=84=B0=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 etc/shutter.php | 434 +++++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 428 insertions(+), 6 deletions(-)

diff --git a/etc/shutter.php b/etc/shutter.php
index 653641d..5289eaf 100644
--- a/etc/shutter.php
+++ b/etc/shutter.php
@@ -92,7 +92,7 @@
                 <button onclick="scrollToSection('section-overview')" class="hover:text-orange-400 transition">개요</button>
                 <button onclick="scrollToSection('section-types')" class="hover:text-orange-400 transition">셔터 종류</button>
                 <button onclick="scrollToSection('section-specs')" class="hover:text-orange-400 transition">성능기준</button>
-                <button onclick="scrollToSection('section-process')" class="hover:text-orange-400 transition">인정절차</button>
+                <button onclick="scrollToSection('section-process')" class="hover:text-orange-400 transition">인정절차/심사</button>
                 <button onclick="scrollToSection('section-install')" class="hover:text-orange-400 transition">설치기준</button>
                 <button onclick="scrollToSection('section-check')" class="hover:text-orange-400 transition">체크리스트</button>
             </div>
@@ -108,7 +108,7 @@
                 <button onclick="scrollToSection('section-overview')" class="block w-full text-left py-2 text-slate-300 hover:text-orange-400">개요</button>
                 <button onclick="scrollToSection('section-types')" class="block w-full text-left py-2 text-slate-300 hover:text-orange-400">셔터 종류</button>
                 <button onclick="scrollToSection('section-specs')" class="block w-full text-left py-2 text-slate-300 hover:text-orange-400">성능기준</button>
-                <button onclick="scrollToSection('section-process')" class="block w-full text-left py-2 text-slate-300 hover:text-orange-400">인정절차</button>
+                <button onclick="scrollToSection('section-process')" class="block w-full text-left py-2 text-slate-300 hover:text-orange-400">인정절차/심사</button>
                 <button onclick="scrollToSection('section-install')" class="block w-full text-left py-2 text-slate-300 hover:text-orange-400">설치기준</button>
                 <button onclick="scrollToSection('section-check')" class="block w-full text-left py-2 text-slate-300 hover:text-orange-400">체크리스트</button>
             </div>
@@ -453,12 +453,29 @@
             <div class="flex items-center gap-3 mb-8">
                 <div class="w-12 h-12 fire-gradient rounded-xl flex items-center justify-center text-white font-bold text-lg">4</div>
                 <div>
-                    <h2 class="text-2xl font-bold text-white">품질인정 절차</h2>
-                    <p class="text-slate-400 text-sm">Recognition Process</p>
+                    <h2 class="text-2xl font-bold text-white">품질인정 절차 및 심사</h2>
+                    <p class="text-slate-400 text-sm">Recognition Process & Audit</p>
                 </div>
             </div>
 
-            <div class="card-glass rounded-2xl p-8">
+            <!-- Sub Navigation for Process -->
+            <div class="flex gap-2 mb-6 overflow-x-auto pb-2">
+                <button id="proc-tab-flow" onclick="showProcessTab('flow')" class="tab-active px-5 py-2 rounded-lg font-medium whitespace-nowrap transition text-sm">
+                    인정 절차
+                </button>
+                <button id="proc-tab-audit" onclick="showProcessTab('audit')" class="bg-slate-700 text-slate-300 px-5 py-2 rounded-lg font-medium whitespace-nowrap hover:bg-slate-600 transition text-sm">
+                    인정심사 항목
+                </button>
+                <button id="proc-tab-docs" onclick="showProcessTab('docs')" class="bg-slate-700 text-slate-300 px-5 py-2 rounded-lg font-medium whitespace-nowrap hover:bg-slate-600 transition text-sm">
+                    필수 서류
+                </button>
+                <button id="proc-tab-post" onclick="showProcessTab('post')" class="bg-slate-700 text-slate-300 px-5 py-2 rounded-lg font-medium whitespace-nowrap hover:bg-slate-600 transition text-sm">
+                    사후관리
+                </button>
+            </div>
+
+            <!-- Tab Content: Flow -->
+            <div id="proc-content-flow" class="card-glass rounded-2xl p-8 animate-slide-up">
                 <div class="flex items-center gap-2 mb-8">
                     <div class="w-8 h-8 bg-blue-500/20 rounded-lg flex items-center justify-center">
                         <span>🏛️</span>
@@ -523,6 +540,392 @@
                     </p>
                 </div>
             </div>
+
+            <!-- Tab Content: Audit (인정심사 항목) -->
+            <div id="proc-content-audit" class="card-glass rounded-2xl p-8 hidden animate-slide-up">
+                <div class="flex items-center gap-2 mb-6">
+                    <div class="w-8 h-8 bg-orange-500/20 rounded-lg flex items-center justify-center">
+                        <span>📋</span>
+                    </div>
+                    <span class="text-white font-bold text-lg">인정심사 주요 체크항목</span>
+                </div>
+
+                <div class="grid md:grid-cols-2 gap-6">
+                    <!-- 제조현장 품질관리 확인 -->
+                    <div class="bg-slate-800/50 rounded-xl p-6 border border-slate-600">
+                        <h4 class="text-orange-400 font-bold mb-4 flex items-center gap-2">
+                            <span class="text-xl">🏭</span> 제조현장 품질관리 확인
+                        </h4>
+                        <ul class="space-y-3 text-slate-300 text-sm">
+                            <li class="flex items-start gap-2">
+                                <span class="text-green-400 mt-0.5">✓</span>
+                                <div>
+                                    <strong class="text-white">원재료 입고검사</strong>
+                                    <p class="text-slate-400">슬랫, 가이드레일 등 주요 재료 품질기준 충족 여부</p>
+                                </div>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-green-400 mt-0.5">✓</span>
+                                <div>
+                                    <strong class="text-white">제조공정 관리</strong>
+                                    <p class="text-slate-400">배합비 허용오차 ±10% 이하, 공정 표준 준수</p>
+                                </div>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-green-400 mt-0.5">✓</span>
+                                <div>
+                                    <strong class="text-white">제품검사</strong>
+                                    <p class="text-slate-400">출하 전 성능 검사, LOT별 기록 관리</p>
+                                </div>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-green-400 mt-0.5">✓</span>
+                                <div>
+                                    <strong class="text-white">제조·검사설비 유지관리</strong>
+                                    <p class="text-slate-400">설비 점검 기록, 교정 현황</p>
+                                </div>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-green-400 mt-0.5">✓</span>
+                                <div>
+                                    <strong class="text-white">부적합품 및 불만처리</strong>
+                                    <p class="text-slate-400">부적합 처리 절차, 고객 불만 대응 기록</p>
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <!-- 인정 적정성 심사 -->
+                    <div class="bg-slate-800/50 rounded-xl p-6 border border-slate-600">
+                        <h4 class="text-blue-400 font-bold mb-4 flex items-center gap-2">
+                            <span class="text-xl">🔍</span> 인정 적정성 심사
+                        </h4>
+                        <ul class="space-y-3 text-slate-300 text-sm">
+                            <li class="flex items-start gap-2">
+                                <span class="text-blue-400 mt-0.5">▸</span>
+                                <div>
+                                    <strong class="text-white">성능 적합성</strong>
+                                    <p class="text-slate-400">품질시험 결과 내화·차연·개폐성능 충족 확인</p>
+                                </div>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-blue-400 mt-0.5">▸</span>
+                                <div>
+                                    <strong class="text-white">내구성 및 안전성</strong>
+                                    <p class="text-slate-400">부가시험 결과 (차연성능, 개폐성능 등)</p>
+                                </div>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-blue-400 mt-0.5">▸</span>
+                                <div>
+                                    <strong class="text-white">시공 적정성</strong>
+                                    <p class="text-slate-400">시험체 제작확인서, 시험결과보고서 검토</p>
+                                </div>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-blue-400 mt-0.5">▸</span>
+                                <div>
+                                    <strong class="text-white">설계도서 적합성</strong>
+                                    <p class="text-slate-400">인정 규격과 실제 설계도면 일치 여부</p>
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+
+                <!-- 신청자격 제한 사항 -->
+                <div class="mt-6 bg-red-500/10 border border-red-500/30 rounded-xl p-6">
+                    <h4 class="text-red-400 font-bold mb-4 flex items-center gap-2">
+                        <span class="text-xl">⛔</span> 신청자격 제한 사유
+                    </h4>
+                    <div class="grid md:grid-cols-2 gap-4 text-sm">
+                        <div class="bg-slate-800/30 rounded-lg p-4">
+                            <p class="text-white font-medium mb-2">6개월 이내 취소 시</p>
+                            <ul class="text-slate-400 space-y-1">
+                                <li>• 유효기간 연장 시험 불합격</li>
+                                <li>• 경미한 개선요청 미이행</li>
+                            </ul>
+                        </div>
+                        <div class="bg-slate-800/30 rounded-lg p-4">
+                            <p class="text-white font-medium mb-2">12개월 이내 취소 시</p>
+                            <ul class="text-slate-400 space-y-1">
+                                <li>• 일시정지 중 제품 판매</li>
+                                <li>• 품질관리 허위/점검 거부</li>
+                            </ul>
+                        </div>
+                        <div class="bg-slate-800/30 rounded-lg p-4 md:col-span-2">
+                            <p class="text-white font-medium mb-2">24개월 이내 취소 시</p>
+                            <ul class="text-slate-400 space-y-1">
+                                <li>• 시험체 허위 제작 후 인정 취득</li>
+                                <li>• 원재료 품질기준 미달 제품 판매</li>
+                                <li>• 미인정 제품을 인정 제품으로 판매</li>
+                                <li>• 배합비 상이 제품 판매</li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Tab Content: Docs (필수 서류) -->
+            <div id="proc-content-docs" class="card-glass rounded-2xl p-8 hidden animate-slide-up">
+                <div class="flex items-center gap-2 mb-6">
+                    <div class="w-8 h-8 bg-green-500/20 rounded-lg flex items-center justify-center">
+                        <span>📁</span>
+                    </div>
+                    <span class="text-white font-bold text-lg">인정 신청 및 심사 필수 서류</span>
+                </div>
+
+                <div class="space-y-6">
+                    <!-- 인정 신청 서류 -->
+                    <div>
+                        <h4 class="text-orange-400 font-bold mb-4 text-lg">📋 인정 신청 시 제출 서류</h4>
+                        <div class="grid md:grid-cols-2 gap-4">
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-orange-500">
+                                <p class="text-white font-medium">건축자재등 인정신청서</p>
+                                <p class="text-slate-400 text-sm">관리기준 제1호서식</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-orange-500">
+                                <p class="text-white font-medium">설계도서</p>
+                                <p class="text-slate-400 text-sm">상세 구조도, 재료 규격, 치수 도면</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-orange-500">
+                                <p class="text-white font-medium">품질관리설명서</p>
+                                <p class="text-slate-400 text-sm">배합비, 공정관리, 검사설비 목록 포함</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-orange-500">
+                                <p class="text-white font-medium">사업자등록증</p>
+                                <p class="text-slate-400 text-sm">제조업 등록 확인</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-orange-500">
+                                <p class="text-white font-medium">공장등록증</p>
+                                <p class="text-slate-400 text-sm">제조현장 소재지 확인</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-orange-500">
+                                <p class="text-white font-medium">품질시험 희망기관 신청서</p>
+                                <p class="text-slate-400 text-sm">KOLAS 공인시험기관 지정</p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- 심사 과정 서류 -->
+                    <div>
+                        <h4 class="text-blue-400 font-bold mb-4 text-lg">🔍 심사 과정 생성 서류</h4>
+                        <div class="grid md:grid-cols-2 gap-4">
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-blue-500">
+                                <p class="text-white font-medium">시료채취확인서</p>
+                                <p class="text-slate-400 text-sm">별지 제3호서식 - 현장 시료 채취 기록</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-blue-500">
+                                <p class="text-white font-medium">품질시험 결과보고서</p>
+                                <p class="text-slate-400 text-sm">별지 제4호서식 - 시험기관 발급</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-blue-500">
+                                <p class="text-white font-medium">시험체 제작확인서</p>
+                                <p class="text-slate-400 text-sm">별지 제5호서식 - 시험체 규격 확인</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-blue-500">
+                                <p class="text-white font-medium">제조현장 품질관리점검표</p>
+                                <p class="text-slate-400 text-sm">공장심사 결과 기록</p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- 인정 후 관리 서류 -->
+                    <div>
+                        <h4 class="text-green-400 font-bold mb-4 text-lg">✅ 인정 후 제출/비치 서류</h4>
+                        <div class="grid md:grid-cols-2 gap-4">
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-green-500">
+                                <p class="text-white font-medium">품질인정서</p>
+                                <p class="text-slate-400 text-sm">별지 제2호서식 - KICT 원장 발급</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-green-500">
+                                <p class="text-white font-medium">품질관리서</p>
+                                <p class="text-slate-400 text-sm">제조사 → 감리자 제출 보증서</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-green-500">
+                                <p class="text-white font-medium">생산 및 판매실적</p>
+                                <p class="text-slate-400 text-sm">별지 제7호서식 - 분기별 제출</p>
+                            </div>
+                            <div class="bg-slate-800/50 rounded-lg p-4 border-l-4 border-green-500">
+                                <p class="text-white font-medium">시공실적</p>
+                                <p class="text-slate-400 text-sm">현장별 시공 내역 기록</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Tab Content: Post (사후관리) -->
+            <div id="proc-content-post" class="card-glass rounded-2xl p-8 hidden animate-slide-up">
+                <div class="flex items-center gap-2 mb-6">
+                    <div class="w-8 h-8 bg-purple-500/20 rounded-lg flex items-center justify-center">
+                        <span>🔄</span>
+                    </div>
+                    <span class="text-white font-bold text-lg">사후관리 체계</span>
+                </div>
+
+                <!-- 사후관리 유형 -->
+                <div class="grid md:grid-cols-2 gap-6 mb-8">
+                    <div class="bg-slate-800/50 rounded-xl p-6 border border-purple-500/30">
+                        <h4 class="text-purple-400 font-bold mb-4 flex items-center gap-2">
+                            <span class="text-xl">🏭</span> 제조현장 품질관리 확인점검
+                        </h4>
+                        <ul class="space-y-3 text-slate-300 text-sm">
+                            <li class="flex items-center gap-2">
+                                <span class="text-purple-400">▸</span>
+                                <span><strong class="text-white">점검 주기:</strong> 연 1회 이상</span>
+                            </li>
+                            <li class="flex items-center gap-2">
+                                <span class="text-purple-400">▸</span>
+                                <span><strong class="text-white">점검 방식:</strong> 정기 + 불시 점검</span>
+                            </li>
+                            <li class="flex items-center gap-2">
+                                <span class="text-purple-400">▸</span>
+                                <span><strong class="text-white">점검 기관:</strong> KICT + 시험기관 지원</span>
+                            </li>
+                        </ul>
+                        <div class="mt-4 bg-slate-700/50 rounded-lg p-3">
+                            <p class="text-slate-400 text-xs">
+                                ※ 최근 1년 내 인정신청/유효기간 연장으로 점검 실적이 있으면 동일 품목 점검 생략 가능
+                            </p>
+                        </div>
+                    </div>
+
+                    <div class="bg-slate-800/50 rounded-xl p-6 border border-blue-500/30">
+                        <h4 class="text-blue-400 font-bold mb-4 flex items-center gap-2">
+                            <span class="text-xl">🏗️</span> 건축공사장 품질관리 확인점검
+                        </h4>
+                        <ul class="space-y-3 text-slate-300 text-sm">
+                            <li class="flex items-center gap-2">
+                                <span class="text-blue-400">▸</span>
+                                <span><strong class="text-white">점검 대상:</strong> 인정제품 시공 현장</span>
+                            </li>
+                            <li class="flex items-center gap-2">
+                                <span class="text-blue-400">▸</span>
+                                <span><strong class="text-white">확인 사항:</strong> 품질인정서, 품질관리서</span>
+                            </li>
+                            <li class="flex items-center gap-2">
+                                <span class="text-blue-400">▸</span>
+                                <span><strong class="text-white">시공 확인:</strong> 인정 내용과 동일 시공 여부</span>
+                            </li>
+                        </ul>
+                        <div class="mt-4 bg-slate-700/50 rounded-lg p-3">
+                            <p class="text-slate-400 text-xs">
+                                ※ 생산/판매실적, 시공현장별 실적 자료 요청 가능
+                            </p>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- 사후관리 점검 체크리스트 -->
+                <div class="bg-slate-800/30 rounded-xl p-6 mb-6">
+                    <h4 class="text-white font-bold mb-4 flex items-center gap-2">
+                        <span class="text-xl">📝</span> 사후관리 점검 체크리스트
+                    </h4>
+                    <div class="grid md:grid-cols-3 gap-4">
+                        <div class="bg-slate-700/50 rounded-lg p-4">
+                            <p class="text-orange-400 font-bold text-sm mb-2">원재료 관리</p>
+                            <ul class="text-slate-300 text-xs space-y-1">
+                                <li>☐ 입고검사 기록 유지</li>
+                                <li>☐ 품질기준 충족 확인</li>
+                                <li>☐ 원재료 보관 상태</li>
+                                <li>☐ 추적성 확보 (LOT 관리)</li>
+                            </ul>
+                        </div>
+                        <div class="bg-slate-700/50 rounded-lg p-4">
+                            <p class="text-blue-400 font-bold text-sm mb-2">제조공정 관리</p>
+                            <ul class="text-slate-300 text-xs space-y-1">
+                                <li>☐ 배합비 준수 (±10%)</li>
+                                <li>☐ 공정 표준 이행</li>
+                                <li>☐ 중간검사 실시</li>
+                                <li>☐ 공정 기록 유지</li>
+                            </ul>
+                        </div>
+                        <div class="bg-slate-700/50 rounded-lg p-4">
+                            <p class="text-green-400 font-bold text-sm mb-2">제품 출하 관리</p>
+                            <ul class="text-slate-300 text-xs space-y-1">
+                                <li>☐ 출하 전 검사 완료</li>
+                                <li>☐ 인정표시 부착</li>
+                                <li>☐ 품질관리서 발행</li>
+                                <li>☐ 판매실적 기록</li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- 제재 조치 -->
+                <div class="grid md:grid-cols-2 gap-6">
+                    <div class="bg-yellow-500/10 border border-yellow-500/30 rounded-xl p-6">
+                        <h4 class="text-yellow-400 font-bold mb-4 flex items-center gap-2">
+                            <span class="text-xl">⚠️</span> 개선요청 및 일시정지
+                        </h4>
+                        <ul class="space-y-2 text-slate-300 text-sm">
+                            <li class="flex items-start gap-2">
+                                <span class="text-yellow-400">•</span>
+                                <span>품질관리 경미한 사항 → <strong class="text-white">30일 내 개선</strong></span>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-yellow-400">•</span>
+                                <span>개선 미이행 시 → <strong class="text-white">인정 일시정지</strong></span>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-yellow-400">•</span>
+                                <span>공동신청 시 → <strong class="text-white">전체 제조현장 일시정지</strong></span>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <div class="bg-red-500/10 border border-red-500/30 rounded-xl p-6">
+                        <h4 class="text-red-400 font-bold mb-4 flex items-center gap-2">
+                            <span class="text-xl">⛔</span> 인정 취소 사유
+                        </h4>
+                        <ul class="space-y-2 text-slate-300 text-sm">
+                            <li class="flex items-start gap-2">
+                                <span class="text-red-400">•</span>
+                                <span>시험체 허위 제작 후 인정 취득</span>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-red-400">•</span>
+                                <span>품질기준 미달 제품 판매</span>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-red-400">•</span>
+                                <span>미인정 제품을 인정 제품으로 판매</span>
+                            </li>
+                            <li class="flex items-start gap-2">
+                                <span class="text-red-400">•</span>
+                                <span>일시정지 사유 미해소</span>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+
+                <!-- 유효기간 연장 안내 -->
+                <div class="mt-6 bg-blue-500/10 border border-blue-500/30 rounded-xl p-6">
+                    <h4 class="text-blue-400 font-bold mb-3 flex items-center gap-2">
+                        <span class="text-xl">🔄</span> 유효기간 연장 절차
+                    </h4>
+                    <div class="flex flex-wrap gap-4 items-center text-sm">
+                        <div class="flex items-center gap-2">
+                            <span class="bg-blue-500 text-white px-3 py-1 rounded-full text-xs font-bold">1</span>
+                            <span class="text-slate-300">만료 12~6개월 전 연장의사 통보</span>
+                        </div>
+                        <span class="text-slate-500">→</span>
+                        <div class="flex items-center gap-2">
+                            <span class="bg-blue-500 text-white px-3 py-1 rounded-full text-xs font-bold">2</span>
+                            <span class="text-slate-300">시료채취 및 품질시험</span>
+                        </div>
+                        <span class="text-slate-500">→</span>
+                        <div class="flex items-center gap-2">
+                            <span class="bg-blue-500 text-white px-3 py-1 rounded-full text-xs font-bold">3</span>
+                            <span class="text-slate-300">심사 후 연장 승인</span>
+                        </div>
+                    </div>
+                    <p class="text-slate-400 text-xs mt-3">
+                        ※ 일시정지 중에는 유효기간 연장 신청 불가. 사유 해소 후 만료 6개월 전까지 신청 필요
+                    </p>
+                </div>
+            </div>
         </section>
 
         <!-- Section 5: Installation Standards -->
@@ -775,6 +1178,25 @@
             document.getElementById('mobile-menu').classList.add('hidden');
         }
 
+        // Process Tab Switch
+        function showProcessTab(type) {
+            const tabs = ['flow', 'audit', 'docs', 'post'];
+            tabs.forEach(t => {
+                const tabBtn = document.getElementById(`proc-tab-${t}`);
+                const content = document.getElementById(`proc-content-${t}`);
+                
+                if (t === type) {
+                    tabBtn.classList.add('tab-active');
+                    tabBtn.classList.remove('bg-slate-700', 'text-slate-300');
+                    content.classList.remove('hidden');
+                } else {
+                    tabBtn.classList.remove('tab-active');
+                    tabBtn.classList.add('bg-slate-700', 'text-slate-300');
+                    content.classList.add('hidden');
+                }
+            });
+        }
+
         // Shutter Type Tabs
         function showShutterType(type) {
             const types = ['steel', 'screen', 'compare'];
@@ -987,4 +1409,4 @@
         });
     </script>
 </body>
-</html>
\ No newline at end of file
+</html>