/* support/inquiry.php 의 인라인 <style> 을 그대로 옮긴 것 (2026-08-20 CSP 강화 — style-src self).
   페이지 전용 규칙이라 다른 페이지에 싣지 않는다. 여기 규칙은 sub.css 보다 늦게 로드되어
   기존 인라인과 같은 캐스케이드 순서를 유지한다. */
/* ---- page-only: 1:1 inquiry layout & form details ---- */
    .inq-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
      gap: clamp(18px, 3vw, 32px);
      align-items: start;
      margin-top: clamp(28px, 4vw, 48px);
    }
    .inq-aside { display: grid; gap: clamp(14px, 2vw, 20px); position: sticky; top: calc(var(--header-h) + 84px); }
    /* select 화살표는 sub.css 공용 규칙으로 올렸다(제보 폼도 같은 화살표가 필요했다). */
    .form-card .form-agree { margin-top: 18px; }
    .form-field input.is-invalid, .form-field select.is-invalid, .form-field textarea.is-invalid {
      border-color: #E5484D;
      box-shadow: 0 0 0 3px rgba(229, 72, 77, .12);
    }
    .form-agree.is-invalid { border-color: #E5484D; background: rgba(229, 72, 77, .05); }
    /* reCAPTCHA 위젯은 304px 고정폭이라 좁은 폰에서 카드를 밀어 가로 스크롤을 만든다(2026-07-22 실측:
       320뷰포트에서 63px 초과). 화면폭 구간별로 축소해 카드 안에 들어오게 한다. transform 은 레이아웃
       박스를 바꾸지 않으므로 래퍼 높이도 같은 배율로 줄여 아래 여백이 뜨지 않게 한다. */
    .form-recaptcha { overflow: hidden; }
    @media (max-width: 420px) {
      /* transform 은 레이아웃 폭을 안 줄이므로(카드가 304px 그대로 벌어짐) 래퍼 폭·높이도 같은 배율로 */
      .form-recaptcha { --rc-s: .86; width: calc(304px * var(--rc-s)); height: calc(78px * var(--rc-s)); max-width: 100%; }
      .form-recaptcha .g-recaptcha { transform: scale(var(--rc-s)); transform-origin: 0 0; }
    }
    @media (max-width: 380px) { .form-recaptcha { --rc-s: .74; } }
    @media (max-width: 344px) { .form-recaptcha { --rc-s: .66; } }
    /* 셀프서비스 압축 링크 한 줄 (IA 재정리 2026-07-21) */
    .inq-self { margin: clamp(18px, 3vw, 26px) 0 0; font-size: .9rem; color: var(--gray-500); }
    .inq-self a { color: #8A5E12; font-weight: 600; text-decoration: none; }
    .inq-self a:hover { text-decoration: underline; }
    .form-success { text-align: center; padding: clamp(24px, 5vw, 48px) 8px; outline: none; }
    .form-success__ico {
      display: inline-flex; align-items: center; justify-content: center;
      width: 64px; height: 64px; border-radius: 50%;
      background: linear-gradient(135deg, rgba(21,142,206,.16), rgba(21,142,206,.05));
      color: var(--brand-600); margin-bottom: 18px;
    }
    .form-success__ico svg { width: 30px; height: 30px; }
    .form-success h3 { font-size: clamp(1.15rem, 2vw, 1.4rem); font-weight: 800; color: var(--ink); margin: 0 0 10px; }
    .form-success p { font-size: .95rem; line-height: 1.8; color: var(--gray-600); margin: 0 auto; max-width: 520px; }
    .icard .dl-btn { margin-top: 16px; }
    @media (max-width: 900px) {
      .inq-grid { grid-template-columns: 1fr; }
      .inq-aside { position: static; grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 560px) {
      .inq-aside { grid-template-columns: 1fr; }
    }