/*
Theme Name: Industo Child
Theme URI: http://demo.casethemes.net/industo/
Author: cellfa
Author URI: https://www.newtypeworks.com/
Description: Industo 차일드 테마 (커스텀 반응형/UX 포함)
Version: 1.0.0
License: ThemeForest
License URI: https://themeforest.net/licenses
Template: industo
Text Domain: industo-child
Tags: business, company, construction, industrial, manufacturing
*/

/* 기본 폰트 글로벌 지정 */
html, body {
  font-family: 
    'Noto Sans KR',
    'NanumSquare',
    'Nanum Gothic',
    'Apple SD Gothic Neo',
    'Malgun Gothic',
    '돋움',
    sans-serif;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -0.3px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/* =============================
   기본 토큰(브랜드 컬러/유틸)
============================= */
:root{
  --brand:#0b62f5;
  --brand-accent:#ff5a3d;
  --ink:#0b0f13;
  --ink-sub:#52607a;
  --surface:#ffffff;
}

/* 고정 헤더 앵커 가림 방지 (필요한 곳에 .anchor-guard 부여) */
.anchor-guard{ scroll-margin-top: 96px; }

/* 접근성: 모션 최소화 */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}

/* =============================
   반응형 레이아웃/히어로
============================= */

/* 1024–1279: 4열→3열 전환, 히어로 높이 조정 */
@media (max-width: 1279.98px) {
  .grid-4 { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .grid-3 { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .section { padding: 72px 0; }
  .hero-min { min-height: 620px; }
  .hero .elementor-slide-content { max-width: 820px; }
} /* <-- 닫힘 추가 */

/* 992–1023: 태블릿 대 – 카드 제목 클램프 강화, GNB 간격 축소 */
@media (max-width: 1023.98px) {
  .grid-3 { grid-template-columns: repeat(2, 1fr); gap: 22px; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); gap: 22px; }
  .section { padding: 64px 0; }
  .hero-min { min-height: 560px; }
  .news-card .title { -webkit-line-clamp: 2; font-size: 1rem; }
  .site-header .menu > li { margin-inline: 12px; }
} /* <-- 닫힘 추가 */

/* 768–991: 태블릿 – 2열 고정, 폰트와 버튼 간격 축소 */
@media (max-width: 991.98px) {
  .grid-2, .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .section { padding: 56px 0; }
  .hero-min { min-height: 520px; }
  .hero .btn-primary, .hero .btn-secondary { padding: .8rem 1.2rem; }
  .h-lead { font-size: clamp(18px, 2.4vw, 22px); }
  .notice-list .title { max-width: 72%; }
} /* <-- 닫힘 추가 */

/* 576–767: 모바일 대 – 1열 전환, 여백/타이포 재조정 */
@media (max-width: 767.98px) {
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; gap: 18px; }
  .section { padding: 48px 0; }
  .hero-min { min-height: 460px; }
  .hero .elementor-slide-content { max-width: 92vw; }
  .badge-date, .date-badge { font-size: .8rem; padding: 3px 7px; }
  .notice-list .title { max-width: 68%; }
} /* <-- 닫힘 추가 */

/* ≤575: 모바일 소 – 터치 타깃 강화, 제목/간격 최적화 */
@media (max-width: 575.98px) {
  .section { padding: 40px 0; }
  .hero-min { min-height: 420px; }
  .news-card { border-radius: 10px; }
  .news-card .title { font-size: .98rem; -webkit-line-clamp: 3; }
  .hero .btn-primary, .hero .btn-secondary { padding: .72rem 1rem; border-radius: 6px; }
  .site-header .menu-toggle { padding: 12px; } /* 모바일 메뉴 버튼 터치영역 */
} /* <-- 닫힘 확인 */

/* GNB 고정 시 시각 안정감(선택) */
.site-header.is-sticky { box-shadow: 0 6px 18px rgba(0,0,0,.06); transition: box-shadow .25s; }

/* 이미지 비율 보정 유틸 (필요 시 사용) */
.ratio-16x9 { aspect-ratio: 16/9; object-fit: cover; }
.ratio-4x3  { aspect-ratio: 4/3;  object-fit: cover; }
.ratio-1x1  { aspect-ratio: 1/1;  object-fit: cover; }

/* =========================================================
   Mobile GNB / CTA / Floating Chat / Tables / Brand Colors
   붙여넣기 위치: style.css 맨 아래
   필요 클래스: .mobile-gnb, .offcanvas, .hamburger, .cta-button, .chat-float, .table-wrap
========================================================= */

/* 0) 브랜드 컬러(필요시 값만 바꾸면 전체 일관성 유지) */
:root{
  --brand:#0b62f5;
  --brand-accent:#ff5a3d;
  --ink:#0b0f13;
  --ink-sub:#52607a;
  --surface:#ffffff;
}

/* 1) 모바일 GNB 줄바꿈 방지 + 좁은 화면 폰트 축소 */
@media (max-width: 991.98px){
  .mobile-gnb,
  .site-header .menu { white-space: nowrap; }
  .site-header .menu > li > a { font-size: .95rem; }
} /* <-- 닫힘 추가 */

@media (max-width: 767.98px){
  .site-header .menu > li > a { font-size: .9rem; }
} /* <-- 닫힘 추가 */

/* 2) 햄버거 버튼 + 오프캔버스(슬라이드 인/아웃) */
.hamburger{ position:relative; width:28px; height:22px; cursor:pointer; }
.hamburger span{
  position:absolute; left:0; width:100%; height:2px; background:var(--ink);
  transform-origin: center; transition: transform .25s, opacity .25s, top .25s;
}
.hamburger span:nth-child(1){ top:0; }
.hamburger span:nth-child(2){ top:10px; }
.hamburger span:nth-child(3){ top:20px; }
.hamburger.is-open span:nth-child(1){ top:10px; transform: rotate(45deg); }
.hamburger.is-open span:nth-child(2){ opacity:0; }
.hamburger.is-open span:nth-child(3){ top:10px; transform: rotate(-45deg); }

/* 오프캔버스 패널 (오른쪽에서 슬라이드) */
.offcanvas{
  position:fixed; inset:0 0 0 auto; width:min(86vw,360px); background:var(--surface);
  box-shadow: -12px 0 28px rgba(0,0,0,.08);
  transform: translateX(100%); transition: transform .3s ease;
  z-index: 1000; overflow:auto; padding:24px;
}
.offcanvas.is-open{ transform: translateX(0); }
.offcanvas .menu a{ display:block; padding:12px 8px; color:var(--ink); }
.offcanvas .menu a:hover{ color:var(--brand); }

/* 3) CTA 버튼(문의) – 강조 + Pulse 애니메이션 */
.cta-button{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5rem; padding:.9rem 1.4rem; border-radius:10px;
  background:var(--brand-accent); color:#fff; font-weight:700;
  box-shadow: 0 10px 24px rgba(255,90,61,.28); transition: transform .15s, box-shadow .15s;
}
.cta-button:hover{ transform: translateY(-2px); box-shadow:0 14px 30px rgba(255,90,61,.35); }
.cta-button:focus{ outline:2px solid rgba(255,90,61,.5); outline-offset:2px; }
.cta-button.pulse{ animation:pulse 1.8s infinite; }
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(255,90,61,.35); }
  70%{ box-shadow:0 0 0 14px rgba(255,90,61,0); }
  100%{ box-shadow:0 0 0 0 rgba(255,90,61,0); }
}

/* 4) 플로팅 상담 버튼(카카오/네이버톡) – 하단 고정 */
.chat-float{
  position:fixed; right:18px; bottom:18px; z-index:1100;
  display:flex; flex-direction:column; gap:10px;
}
.chat-float .chat-btn{
  width:56px; height:56px; border-radius:50%;
  display:grid; place-items:center; background:var(--brand);
  color:#fff; box-shadow:0 10px 24px rgba(11,98,245,.28);
  transition: transform .15s, box-shadow .15s;
}
.chat-float .chat-btn:hover{ transform: translateY(-2px); box-shadow:0 14px 30px rgba(11,98,245,.36); }
.chat-float .chat-btn.kakao{ background:#fee500; color:#1f1f1f; box-shadow:0 10px 24px rgba(254,229,0,.28); }
.chat-float .chat-btn.naver{ background:#03c75a; }
@media (max-width: 575.98px){
  .chat-float{ right:14px; bottom:14px; }
  .chat-float .chat-btn{ width:52px; height:52px; }
} /* <-- 닫힘 추가 */

/* 5) 리스트/테이블 가독성 + 모바일 오버플로우 보호 */
.table-wrap{ width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.table-wrap table{ width:100%; border-collapse: collapse; min-width:640px; }
.table-wrap th, .table-wrap td{ padding:12px 14px; border-bottom:1px solid #e9eef5; font-size:.95rem; }
.table-wrap th{ text-align:left; background:#f8fafc; color:#111827; font-weight:700; }
ul, ol{ padding-left:1.2rem; line-height:1.7; }
@media (max-width:767.98px){
  .table-wrap th, .table-wrap td{ padding:10px 12px; font-size:.92rem; }
} /* <-- 닫힘 확인 */

/* 6) 이미지 최적화(기본 규칙) */
img{ max-width:100%; height:auto; }
.blur-up{ filter: blur(12px); transition: filter .4s; }
.blur-up.lazyloaded{ filter: blur(0); }

/* 7) 링크/버튼 컬러 일관화 */
a{ color:var(--brand); }
a:hover{ color: color-mix(in srgb, var(--brand) 82%, #000 18%); text-decoration: underline; }
button, .button{ background:var(--brand); color:#fff; }
button:hover, .button:hover{ background: color-mix(in srgb, var(--brand) 88%, #000 12%); }

/* 8) 접근성(포커스 링) – 테마 대비 강화 */
:where(a, button, .cta-button, .chat-btn):focus-visible{
  outline: 3px solid color-mix(in srgb, var(--brand) 55%, #fff 45%);
  outline-offset: 2px;
}

/******************************
 * WPForms – 문의폼 정렬/패딩 최종본
 ******************************/

/* 개인정보처리방침 링크 포커스 테두리 제거(파란 라인 방지) */
.privacy-link a:focus { outline: none !important; }

/* 파일 업로드 / 개인정보 동의 / HTML(정책 링크) 필드는 항상 1열(100%) */
.wpforms-field-file-upload,
.wpforms-field-privacy,
.wpforms-field-html,
.wpforms-field-html.wpforms-one-half,
.wpforms-field-privacy.wpforms-one-half,
.wpforms-field-file-upload.wpforms-one-half{
  width: 100% !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box;
}

/* PC(≥768px): 좌측 끝선 맞춤 – 불필요한 좌우 패딩/마진 제거 */
@media (min-width: 768px){
  .wpforms-container-full .wpforms-form .wpforms-field-file-upload,
  .wpforms-container-full .wpforms-form .wpforms-field-privacy,
  .wpforms-container-full .wpforms-form .wpforms-field-html,
  .privacy-link{
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .wpforms-field-file-upload input[type="file"]{
    display: block;
    width: 100% !important;
    max-width: 600px;
    margin: 10px 0;
  }

  .wpforms-field-privacy label{
    display:block !important;
    text-align:left !important;
    margin: 10px 0 0 0 !important;
  }
} /* <-- 닫힘 추가 */

/* 모바일(≤767.98px): 입력칸과 동일 좌우 패딩(14px) 적용 */
@media (max-width: 767.98px){
  .wpforms-field-html,
  .wpforms-field-privacy,
  .wpforms-field-file-upload,
  .privacy-link{
    padding-left: 14px !important;
    padding-right: 14px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    float: none !important;
    clear: both !important;
    box-sizing: border-box;
  }

  .wpforms-field-privacy label{
    display:block !important;
    text-align:left !important;
    margin: 8px 0 0 0 !important;
  }

  .wpforms-field-file-upload input[type="file"]{
    width: 100% !important;
    max-width: 100% !important;
  }
} /* <-- 닫힘 추가 */

/* --- 개인정보처리방침 링크 좌측 여백(PC·모바일 공통) --- */
.privacy-link{
  padding-left: 10px !important;
}

/* ===== NAVER In-App WebView 전용 보정 (Fallback 우선순위 수정) ===== */
.is-naver-app html,
.is-naver-app body {
  font-family:
    'Noto Sans KR',
    'NanumSquare',
    'Nanum Gothic',
    'Apple SD Gothic Neo',
    'Malgun Gothic',
    '돋움',
    sans-serif !important;
  letter-spacing: 0 !important;
  font-synthesis: none !important;
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

.is-naver-app h1,
.is-naver-app h2,
.is-naver-app h3,
.is-naver-app .elementor-heading-title,
.is-naver-app .elementor-slide-content {
  letter-spacing: 0 !important;
  word-break: keep-all !important;
  font-synthesis: none !important;
}

.is-naver-app .btn,
.is-naver-app .button,
.is-naver-app .site-header,
.is-naver-app .menu a {
  letter-spacing: 0 !important;
  font-synthesis: none !important;
}