/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/.pnpm/next@14.2.35_@playwright+test@1.61.1_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[2]!../../node_modules/.pnpm/next@14.2.35_@playwright+test@1.61.1_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[3]!./src/app/layout.module.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*
 * 적응형 앱 셸.
 * - 모바일(기본): 단일 컬럼, --content-max(=480) 로 캡·중앙 정렬. 기존 동작과 동일.
 * - 데스크톱(≥1024px): 풀폭 가로 헤더 + 가운데 정렬 넓은 컨텐츠(--content-max 가 토큰으로 넓어짐).
 * 폭 캡은 .appbarInner / .content 가 각각 담당 → 헤더는 풀-블리드, 콘텐츠는 중앙 정렬.
 */
.layout_shell__r14g5 {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  background: var(--color-surface);
}

.layout_appbar__65Sxo {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 10;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: saturate(180%) blur(12px);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--color-border);
}
/* 헤더 내부 행 — 폭 캡·중앙 정렬. 모바일은 480 컬럼, 데스크톱은 넓은 컨테이너. */
.layout_appbarInner__rTeIX {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  width: 100%;
  max-width: var(--content-max);
  margin: 0 auto;
  height: 56px;
  padding: 0 var(--space-4);
}
/*
 * 브랜드 워드마크 — 디자인 시스템의 블루 "C" 로고를 마크업 변경 없이
 * ::before 의사요소(장식·aria 무영향)로 재현. 텍스트 "CRS" 는 그대로 유지.
 */
.layout_brand__m_W0O {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-weight: 800;
  font-size: var(--text-lg);
  color: var(--color-text);
  letter-spacing: -0.02em;
}
.layout_brand__m_W0O::before {
  content: 'C';
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 7px;
  background: var(--color-primary);
  color: #fff;
  font-size: var(--text-md);
  font-weight: 800;
}
.layout_brand__m_W0O:hover {
  text-decoration: none;
}

/* 데스크톱 가로 내비 — 기본(모바일)에선 숨김. 데스크톱에서만 노출(버튼형). */
.layout_desktopNav__3VRhO {
  display: none;
}

/* 상단 버튼형 내비(pill) — 링크/버튼 공용. */
.layout_navBtn__K1h1C {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 38px;
  padding: 0 var(--space-4);
  border: 1px solid transparent;
  border-radius: var(--radius-pill);
  background: transparent;
  color: var(--color-text-secondary);
  font-family: inherit;
  font-size: var(--text-md);
  font-weight: 600;
  cursor: pointer;
  transition:
    background 0.12s ease,
    color 0.12s ease;
}
.layout_navBtn__K1h1C:hover {
  text-decoration: none;
  background: var(--color-surface);
  color: var(--color-text);
}
.layout_navBtn__K1h1C[aria-current='page'] {
  color: var(--color-primary);
  background: var(--color-primary-soft);
}
.layout_navBtnOutline__Rwfkn {
  border-color: var(--color-border-strong);
}
.layout_navBtnPrimary__xNEks {
  background: var(--color-primary);
  color: var(--color-primary-contrast);
  font-weight: 700;
}
.layout_navBtnPrimary__xNEks:hover {
  background: var(--color-primary-hover);
  color: var(--color-primary-contrast);
}

/* 모바일 전용 표시(<1024px) — 미인증 헤더의 로그인 버튼 등. */
.layout_mobileOnly__E148M {
  display: inline-flex;
}

/* ── 모바일 햄버거 + 드로어(<1024px 전용, 데스크톱은 CSS 로 숨김) ── */
.layout_menuBtn__oWpES {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--touch);
  height: var(--touch);
  border: 0;
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--color-text);
  cursor: pointer;
}
.layout_menuBtn__oWpES:hover {
  background: var(--color-surface);
}

.layout_drawerOverlay__VREJ9 {
  position: fixed;
  inset: 0;
  z-index: 30;
  border: 0;
  padding: 0;
  background: rgba(3, 44, 92, 0.42);
  cursor: default;
}
.layout_drawer__euOFL {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 31;
  width: min(320px, 84vw);
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-4) var(--space-4) calc(var(--space-5) + env(safe-area-inset-bottom, 0));
  background: var(--color-bg);
  box-shadow: var(--shadow-card);
}
.layout_drawerHead__GboAi {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-3);
}
.layout_drawerTitle__HBKnk {
  font-size: var(--text-base);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--color-text);
}
.layout_drawerLink__aYeSA {
  display: flex;
  align-items: center;
  min-height: var(--touch);
  padding: 0 var(--space-3);
  border-radius: var(--radius-md);
  color: var(--color-text);
  font-size: var(--text-base);
  font-weight: 600;
}
.layout_drawerLink__aYeSA:hover {
  text-decoration: none;
  background: var(--color-surface);
}
.layout_drawerLink__aYeSA[aria-current='page'] {
  color: var(--color-primary);
  background: var(--color-primary-soft);
}
.layout_drawerLogout__4V6fd {
  display: flex;
  align-items: center;
  min-height: var(--touch);
  margin-top: var(--space-2);
  padding: 0 var(--space-3);
  border: 0;
  border-top: 1px solid var(--color-border);
  border-radius: 0;
  background: transparent;
  color: var(--color-text-muted);
  font-family: inherit;
  font-size: var(--text-base);
  font-weight: 600;
  cursor: pointer;
  text-align: left;
}
.layout_drawerLogout__4V6fd:hover {
  color: var(--color-text);
}

.layout_main__mXTwS {
  flex: 1 1;
  display: flex;
  flex-direction: column;
}
/* 컨텐츠 컬럼 — 폭 캡·중앙 정렬. 패딩은 기존 .main 패딩을 승계(모바일 무회귀). */
.layout_content__jhh_K {
  width: 100%;
  max-width: var(--content-max);
  margin: 0 auto;
  /* 하단 탭바 제거(햄버거 내비로 대체) — safe-area 만 존중. */
  padding: var(--space-5) var(--space-4) calc(var(--space-8) + env(safe-area-inset-bottom, 0));
}

/* ───────── 데스크톱(≥1024px): 가로 내비 노출 + 여백 확대 ───────── */
@media (min-width: 1024px) {
  .layout_desktopNav__3VRhO {
    display: flex;
    align-items: center;
    gap: var(--space-2);
  }
  /* 데스크톱: 햄버거/드로어/모바일 전용 요소 숨김(상단 버튼형 내비가 대체). */
  .layout_menuBtn__oWpES,
  .layout_drawerOverlay__VREJ9,
  .layout_drawer__euOFL,
  .layout_mobileOnly__E148M {
    display: none;
  }
  .layout_content__jhh_K {
    padding: var(--space-6) var(--space-5) var(--space-8);
  }
}

/*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/.pnpm/next@14.2.35_@playwright+test@1.61.1_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/.pnpm/next@14.2.35_@playwright+test@1.61.1_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/styles/globals.css ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*
 * CRS 모바일 웹 전역 스타일 + 디자인 토큰.
 * 모바일 우선(PRD §10.2): 세로 레이아웃, 터치 타깃 ≥44px, 단일 컬럼.
 * 접근성: 포커스 가시성, 충분한 대비(WCAG AA 지향), prefers-reduced-motion 존중.
 * 디자인 시스템: 오륜 브랜드 팔레트(블루 #0072BB + 딥네이비 #032C5C) + Pretendard.
 *   베이스 색: oryun.org 추출(#0072BB/#032C5C). 중립/배경 톤: danielprayer.org 참고
 *   (#232937/#f4f6fb). 포인트 오렌지(#F6864C)는 소량(dot/하이라이트)만.
 */

/* Pretendard — CDN dynamic-subset(한글 자동 서브셋). base64 임베드 대체. */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css');

:root {
  /*
   * 색 — 오륜 브랜드 매핑: 주색 블루(#0072BB), 다크 섹션/강조 딥네이비(#032C5C),
   * 페이지 배경은 쿨 라이트(#f4f6fb), 카드/표면은 화이트.
   */
  --color-bg: #ffffff;
  --color-surface: #f4f6fb;
  --color-surface-alt: #edeff3;
  --color-primary-soft: #e8f2fa; /* 연한 블루 배경(선택/강조). */
  --color-primary-soft-alt: #f3f8fc;
  --color-border: #e5e6eb;
  --color-border-strong: #d2d3d9; /* 입력/칩 테두리. */
  --color-text: #232937;
  --color-text-secondary: #383f4f;
  --color-text-muted: #6f7585;
  --color-primary: #0072bb;
  --color-primary-hover: #005d99;
  --color-primary-active: #0068ab;
  --color-primary-contrast: #ffffff;
  --color-navy: #032c5c; /* 딥 네이비 — 헤드라인·다크 밴드(오륜 베이스). */
  --color-navy-contrast: #ffffff;
  --color-accent: #f6864c; /* 포인트 오렌지 — dot/하이라이트 소량만(본문 텍스트 금지). */
  --color-danger: #ff4242;
  --color-danger-text: #d32a2a;
  --color-danger-bg: #feecec;
  --color-success: #007a2e;
  --color-success-bg: #e6f8ed;
  --color-warning: #b26a00;
  --color-warning-bg: #fff3e0;
  --color-kakao: #fee500;

  /* 상태 배지 색(상담/계정) — 디자인 시스템 배지 팔레트. */
  --badge-pending: #b26a00;
  --badge-pending-bg: #fff3e0;
  --badge-pending-dot: #ff9200;
  --badge-approved: #007a2e;
  --badge-approved-bg: #e6f8ed;
  --badge-approved-dot: #00bf40;
  --badge-rejected: #d32a2a;
  --badge-rejected-bg: #feecec;
  --badge-rejected-dot: #ff4242;
  --badge-neutral: #5a5c63;
  --badge-neutral-bg: #eef0f2;

  /* 간격 척도. */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-8: 48px;

  /* radius 척도 — 디자인 시스템(pill / lg / md / 기본 / sm). */
  --radius-lg: 14px;
  --radius: 12px;
  --radius-md: 10px;
  --radius-sm: 6px;
  --radius-pill: 999px;

  /* 그림자 — 카드/포커스링/subtle. */
  --shadow-card: 0 8px 30px rgba(3, 44, 92, 0.1);
  --shadow-subtle: 0 1px 3px rgba(3, 44, 92, 0.08);
  --focus-ring: 0 0 0 3px rgba(0, 114, 187, 0.14);

  /*
   * 폰트 — Pretendard 우선(CDN dynamic-subset 로 layout 에서 로드), system 폴백 유지.
   */
  --font-sans: 'Pretendard Variable', Pretendard, system-ui, -apple-system, 'Segoe UI',
    'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  /* 타이포 스케일 — 11/12/13/14/15/16/17/18/20/24px. 본문 기준 ~14. */
  --text-2xs: 11px;
  --text-xs: 12px;
  --text-sm: 13px;
  --text-md: 14px;
  --text-base: 15px;
  --text-lg: 17px;
  --text-xl: 20px;
  --text-2xl: 24px;

  /* 터치 타깃 최소 높이. */
  --touch: 44px;

  /* 모바일 컨테이너 최대폭(데스크톱은 중앙 정렬). */
  --container-max: 480px;

  /*
   * 반응형(적응형) 브레이크포인트 토큰.
   * 주의: CSS 커스텀 프로퍼티는 @media 조건에 쓸 수 없으므로(미디어쿼리는 px 리터럴 사용),
   *       아래 값은 "단일 기준값" 문서화 목적이다. 미디어쿼리에는 동일 px 를 직접 적는다.
   *   모바일(기본) < --bp-tablet(768) ≤ 태블릿 < --bp-desktop(1024) ≤ 데스크톱
   */
  --bp-tablet: 768px;
  --bp-desktop: 1024px;

  /* 콘텐츠 컨테이너 최대폭 — 페이지 셸이 뷰포트별로 넓힌다(기본=모바일). */
  --content-max: var(--container-max);
}

/*
 * 적응형 컨테이너 폭: 모바일은 480, 태블릿/데스크톱은 넓힌다.
 * 셸/페이지가 var(--content-max) 를 참조하므로 토큰만 바꿔 일괄 반영.
 */
@media (min-width: 768px) {
  :root {
    --content-max: 720px;
  }
}
@media (min-width: 1024px) {
  :root {
    --content-max: 1040px;
  }
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  /* 페이지 바탕은 쿨 라이트(--color-surface) — 카드/표면(--color-bg 화이트)이 떠 보이게. */
  background: var(--color-surface);
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: var(--text-md);
  line-height: 1.5;
  letter-spacing: -0.01em;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: var(--color-primary);
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

/* 포커스 가시성(키보드 내비) — 접근성 필수. 디자인 포커스링 + outline 병행. */
:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

h1,
h2,
h3 {
  margin: 0 0 var(--space-3);
  line-height: 1.3;
  letter-spacing: -0.02em;
}
h1 {
  font-size: var(--text-2xl);
  font-weight: 800;
}
h2 {
  font-size: var(--text-xl);
  font-weight: 700;
}
h3 {
  font-size: var(--text-lg);
  font-weight: 700;
}

p {
  margin: 0 0 var(--space-3);
}

/*
 * 인증 폼 카드(적응형) — login/signup/verify/password/reconsent 공용.
 * 모바일: 전체폭(기존 동작 유지, 추가 제약 없음).
 * 데스크톱(≥1024px): 화면 중앙의 max 440px 카드(전체폭 X).
 * 순수 프레젠테이션 유틸 — 마크업/역할 무변경, 폭·정렬만.
 */
.auth-card {
  width: 100%;
}
@media (min-width: 1024px) {
  .auth-card {
    max-width: 440px;
    margin: var(--space-6) auto 0;
    padding: var(--space-6);
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
  }
}

/* 스크린리더 전용 텍스트. */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/.pnpm/next@14.2.35_@playwright+test@1.61.1_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[2]!../../node_modules/.pnpm/next@14.2.35_@playwright+test@1.61.1_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[3]!./src/components/footer.module.css ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*
 * 데스크톱 푸터 — 기본(모바일)은 숨김, ≥1024px 에서만 노출.
 * 브랜드+카피라이트만(앱 내비 링크 없음 — 상단 AppNav 전담).
 * 폭 캡·중앙 정렬은 .inner 가 담당(.appbarInner/.content 와 동일 규칙).
 */
.footer_footer__GoTLO {
  display: none;
}

@media (min-width: 1024px) {
  .footer_footer__GoTLO {
    display: block;
    margin-top: auto;
    background: var(--color-surface-alt);
    border-top: 1px solid var(--color-border);
  }
}

.footer_inner__03uiJ {
  width: 100%;
  max-width: var(--content-max);
  margin: 0 auto;
  padding: var(--space-6) var(--space-5);
}

.footer_brand__K4Gvk {
  font-weight: 800;
  font-size: var(--text-lg);
  color: var(--color-text);
  letter-spacing: -0.02em;
}

.footer_desc__3sJZ2 {
  margin: var(--space-2) 0 0;
  color: var(--color-text-muted);
  font-size: var(--text-sm);
}

.footer_copyright__hfQeI {
  margin: var(--space-6) 0 0;
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
  color: var(--color-text-muted);
  font-size: var(--text-xs);
}

