/* 똑디 디자인 시스템 컴포넌트 규격 — 공개 페이지(홈·가격·포트폴리오·문의·칼럼·로그인·Audit 신청)와 공용 헤더 (2026-10-23 대표 지시: 랜딩까지 전부 시스템 규격)
   기준: 디자인 시스템 components/bundle.css. 크기·글자·모서리·그림자만 맞추고 색은 각 페이지 규칙을 따른다.
   Button 기본 40px·15px / 랜딩 CTA lg 48px·16px / sm 32px·13px, 모서리 6px, 알약 버튼·버튼 그림자 없음
   Input·Dropdown 40px·15px(모바일 44px·16px), 모서리 6px · 라벨 14px·500 · Badge 20px·12px·모서리 4px · 태그 칩 28px·13px 알약
   html body:not(#ds-a):not(#ds-b)는 페이지마다 다른 옛 규칙보다 항상 이기도록 선택자 강도를 올린다. */

/* 공용 헤더 CTA: 알약·그림자 → 기본 버튼 */
html body:not(#ds-a):not(#ds-b) .nav .btn { min-height: 40px !important; height: 40px !important; padding: 0 16px !important; border-radius: 6px !important; box-shadow: none !important; font-size: 15px !important; font-weight: 600 !important; gap: 8px !important; }

/* 랜딩·페이지 CTA: lg 48px·16px */
html body:not(#ds-a):not(#ds-b) .btn:not(.nav .btn) { min-height: 48px !important; padding: 12px 24px !important; border-radius: 6px !important; box-shadow: none !important; font-size: 16px !important; font-weight: 600 !important; gap: 8px !important; }
html body:not(#ds-a):not(#ds-b) .btn.plan-followup { min-height: 40px !important; padding: 8px 16px !important; font-size: 15px !important; }

/* 입력 줄에 붙는 버튼(뉴스레터·로그인)은 입력칸과 같은 기본 40px */
html body:not(#ds-a):not(#ds-b) .home-newsletter-form .btn,
html body:not(#ds-a):not(#ds-b) .newsletter-form .newsletter-btn,
html body:not(#ds-a):not(#ds-b) form button[type="submit"]:not(.btn) { min-height: 40px !important; height: 40px !important; padding: 0 16px !important; border-radius: 6px !important; box-shadow: none !important; font-size: 15px !important; font-weight: 600 !important; }

/* 작은 조작 버튼(캐러셀 재생·이전·다음) */
html body:not(#ds-a):not(#ds-b) .website-cases-control { height: 32px !important; min-height: 32px !important; padding: 0 12px !important; border-radius: 6px !important; font-size: 13px !important; font-weight: 600 !important; }

/* Input·Dropdown·Textarea */
html body:not(#ds-a):not(#ds-b) input[type="text"]:not(.pa-dialog *),
html body:not(#ds-a):not(#ds-b) input[type="email"]:not(.pa-dialog *),
html body:not(#ds-a):not(#ds-b) input[type="tel"],
html body:not(#ds-a):not(#ds-b) input[type="url"]:not(.pa-dialog *),
html body:not(#ds-a):not(#ds-b) input[type="search"],
html body:not(#ds-a):not(#ds-b) input[type="password"],
html body:not(#ds-a):not(#ds-b) input:not([type]),
html body:not(#ds-a):not(#ds-b) select { height: 40px !important; min-height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; padding-left: 12px !important; border-radius: 6px !important; font-size: 15px !important; line-height: 22px !important; box-sizing: border-box; }
html body:not(#ds-a):not(#ds-b) input[type="text"]:not(.pa-dialog *), html body:not(#ds-a):not(#ds-b) input[type="email"]:not(.pa-dialog *), html body:not(#ds-a):not(#ds-b) input[type="tel"], html body:not(#ds-a):not(#ds-b) input[type="url"]:not(.pa-dialog *), html body:not(#ds-a):not(#ds-b) input[type="password"], html body:not(#ds-a):not(#ds-b) input:not([type]) { padding-right: 12px !important; }
html body:not(#ds-a):not(#ds-b) select { -webkit-appearance: none !important; appearance: none !important; padding-right: 36px !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236F747B' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 12px center !important; background-size: 16px 16px !important; }
html body:not(#ds-a):not(#ds-b) textarea:not(.pa-dialog *) { padding: 10px 12px !important; border-radius: 6px !important; font-size: 15px !important; line-height: 24px !important; }
html body:not(#ds-a):not(#ds-b) input::placeholder, html body:not(#ds-a):not(#ds-b) textarea::placeholder { color: #818496 !important; }
html body:not(#ds-a):not(#ds-b) input:focus-visible, html body:not(#ds-a):not(#ds-b) select:focus-visible, html body:not(#ds-a):not(#ds-b) textarea:focus-visible, html body:not(#ds-a):not(#ds-b) .btn:focus-visible, html body:not(#ds-a):not(#ds-b) button:focus-visible { outline: 2px solid #161A1C !important; outline-offset: 2px !important; }

/* 라벨(문의·로그인·Audit 신청 양식): 14px·500·ink */
html body:not(#ds-a):not(#ds-b) .field > label, html body:not(#ds-a):not(#ds-b) form label[for]:not(.sr-only) { font-size: 14px !important; font-weight: 500 !important; line-height: 22px !important; color: #161A1C !important; }

/* Badge·태그 칩 */
html body:not(#ds-a):not(#ds-b) .plan-tag { height: 20px !important; padding: 0 8px !important; border-radius: 4px !important; font-size: 12px !important; font-weight: 600 !important; line-height: 20px !important; display: inline-flex !important; align-items: center !important; }
html body:not(#ds-a):not(#ds-b) .cred-badge { height: 28px !important; padding: 0 12px !important; border-radius: 999px !important; font-size: 13px !important; font-weight: 600 !important; line-height: 28px !important; box-shadow: none !important; }

@media (max-width: 767px) {
  html body:not(#ds-a):not(#ds-b) .nav .btn { height: 44px !important; min-height: 44px !important; }
  html body:not(#ds-a):not(#ds-b) .home-newsletter-form .btn, html body:not(#ds-a):not(#ds-b) .newsletter-form .newsletter-btn, html body:not(#ds-a):not(#ds-b) form button[type="submit"]:not(.btn) { height: 44px !important; min-height: 44px !important; }
  html body:not(#ds-a):not(#ds-b) .website-cases-control { height: 36px !important; min-height: 36px !important; }
  html body:not(#ds-a):not(#ds-b) input[type="text"]:not(.pa-dialog *), html body:not(#ds-a):not(#ds-b) input[type="email"]:not(.pa-dialog *), html body:not(#ds-a):not(#ds-b) input[type="tel"], html body:not(#ds-a):not(#ds-b) input[type="url"]:not(.pa-dialog *), html body:not(#ds-a):not(#ds-b) input[type="search"], html body:not(#ds-a):not(#ds-b) input[type="password"], html body:not(#ds-a):not(#ds-b) input:not([type]), html body:not(#ds-a):not(#ds-b) select { height: 44px !important; font-size: 16px !important; }
  html body:not(#ds-a):not(#ds-b) textarea:not(.pa-dialog *) { font-size: 16px !important; }
  /* 칼럼 뉴스레터: 세로 배치에서 입력칸이 240px로 늘어나던 기존 문제(flex-basis가 높이로 적용) */
  html body:not(#ds-a):not(#ds-b) .newsletter-form .newsletter-input { flex: 0 0 auto !important; }
}