/* 페이지 기본 스타일. 기존 style 위치에서 읽어 우선순위를 유지한다. */
/* ── Design tokens ─────────────────────────── */
    :root {

      --surface-sub:var(--rule);
      --text:var(--ink);
      --action-deep:var(--ink);
      --graphite:var(--ink);
      --border-mid:var(--rule);
      --line-soft:var(--rule);
      --font-sans:var(--font);
      --font-mono:var(--font);
      --font-serif:var(--font);
      --wave-slow:     3.5s;
      --r-sm: var(--r-inset); --r-md: var(--radius-md); --r-lg: var(--r-panel); --r-xl: var(--r-panel); /* --r-full 은 .chip 제거로 사용처 0 */
      --nav-h:68px;
      --nav-bg:color-mix(in srgb,var(--canvas) 88%,transparent);
      --type-display: var(--fs-h1);
      --type-h1: var(--fs-h2);
      --type-h2: var(--fs-h2);
      --type-h3: var(--fs-h3);
      --type-body-l: var(--fs-body);
      --type-body: var(--fs-body);
      --type-label: var(--fs-caption);
      --type-meta: var(--fs-label);
    }
    /* 다크 — 이 블록은 그동안 도달 불가라(테마 세터 부재) 실제로 렌더된 적이 없다.
       --identity 는 .eyebrow-text/.sec-num/em 같은 "텍스트"에도 쓰이므로 다크에선
       밝아야 한다(옛 값 #575866 은 canvas var(--ink) 위에서 2.4:1 로 AA 미달이었다).
       --action 은 밝게 뒤집고 그 위 글자는 --action-text 로 함께 뒤집는다. */
    *, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
    html { scroll-behavior:smooth; }
    body { background:var(--canvas); color:var(--text); font-family:var(--font); font-size: var(--fs-lead); line-height:1.65; -webkit-font-smoothing:antialiased; }
    a { color:inherit; text-decoration:none; }

    /* ── Utility ───────────────────────────────── */
    .mono { font-family:var(--font); letter-spacing:.06em; }
    /* (제거됨) .chip 블록 전체(.chip · .chip.gold/.green/.orange/.blue · .chip .dot)
       — 이 페이지엔 chip 마크업이 하나도 없다(사용처 0). 색 변형은 폐기된 장식 색 회전(e123a56)이고,
       칩을 다시 쓸 일이 생기면 홈(index.html)의 .chip 규칙을 기준으로 삼아라. */

    /* ── NAV ───────────────────────────────────── */

    /* ── HERO ──────────────────────────────────── */
    .hero {
      position:relative; overflow:hidden; min-height:0;
      padding: var(--space-9) var(--space-5) var(--space-8);
      display:flex; flex-direction:column; align-items:center;
      text-align:center; gap: var(--space-5); justify-content:center;
    }
    .hero > * { position:relative; z-index:1; }
    .hero-eyebrow { display:flex; align-items:center; gap: var(--space-3); }
    .eyebrow-text { font-family:var(--font); font-size:var(--type-label); letter-spacing:.12em; text-transform:uppercase; color:var(--identity); }
    .hero-h1 { font-family:var(--font); font-size:var(--type-display); letter-spacing:-.033em; line-height:1.1; color:var(--text); max-width:860px; }
    .hero-h1 em { font-style:normal; color:var(--identity); }
    .hero-lead { font-size:var(--type-body-l); color:var(--ink); line-height:1.75; max-width:560px; word-break:keep-all; }
    .hero-sub-lead { font-size:var(--type-body); color:var(--graphite); line-height:1.75; max-width:480px; word-break:keep-all; margin-top:0; }
    .hero-cta { display:flex; gap: var(--space-3); flex-wrap:wrap; justify-content:center; }
    /* (제거됨) .hero-stats/.hero-stat/.hero-stat-val/.hero-stat-label — 히어로 지표 행이
       마크업에서 사라진 뒤 남은 규칙. 사용처 0. */

    /* ── Section scaffold ──────────────────────── */
    section { padding:var(--section-space) 0; }
    .inner  { width:min(var(--page-max), calc(100% - 2 * var(--page-gutter))); margin:0 auto; }
    .sec-label { display:flex; align-items:center; gap: var(--space-3); margin-bottom: var(--space-7); }
    .sec-name { font-size:var(--type-label); letter-spacing:.10em; text-transform:uppercase; color:var(--ink); }
    .sec-rule { flex:1; height:1px; background:var(--rule); }

    /* ── WHAT WE DO (회사 소개) ─────────────────── */
    .wwd-grid { display:grid; grid-template-columns:1fr; gap: var(--space-7); align-items:start; }
    .wwd-left h2 { font-family:var(--font); font-size:var(--type-h2); letter-spacing:-.022em; line-height:1.18; margin-bottom: var(--space-5); }
    .wwd-left h2 em { font-style:normal; color:var(--identity); }
    .wwd-left p { font-size:var(--type-body-l); color:var(--ink); line-height:1.78; margin-bottom: var(--space-4); }
    /* (제거됨) .wwd-callout/.wwd-right/.wwd-fact/.wwd-fact-label/.wwd-values/.wwd-chips
       — #what-we-do 우측 컬럼이 마크업에서 사라진 뒤 남은 규칙. 사용처 0. */

    /* ── HOW WE WORK (일하는 방식) ───────────────
       밝은 읽기 글래스. 2×2 카드. 정적 카드에 들어 올리는 움직임은 두지 않는다. */
    #how-we-work { background:var(--canvas); }
    .hww-header { margin-bottom: var(--space-6); }
    .hww-header h2 { font-family:var(--font); font-size:var(--type-h2); letter-spacing:-.02em; margin-bottom: var(--space-4); color:var(--ink); }
    .hww-header h2 em { font-style:normal; color:var(--ink); }
    .hww-header p { font-size:var(--type-body-l); color:var(--ink); max-width:600px; line-height:1.75; }
    #how-we-work .hww-grid {
      display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap: var(--space-4);
    }
    #how-we-work .hww-card {
      padding: var(--space-6) var(--space-5); display:flex; flex-direction:column; gap: var(--space-4);
      overflow:hidden; transform:none;
    }
    #how-we-work .hww-card-num { font-family:var(--font); font-size:var(--type-meta); color:var(--ink-2); letter-spacing:.08em; }
    #how-we-work .hww-card h3 { font-size:var(--type-h3); font-weight:600; line-height:1.35; color:var(--ink); margin:0; }
    #how-we-work .hww-card > p { font-size:var(--type-body-l); color:var(--ink); line-height:1.72; margin:0; }

    /* ── GOOD FIT (이런 분을 원합니다) ───────── */
    .gf-intro { margin-bottom: var(--space-7); }
    .gf-intro h2 { font-family:var(--font); font-size:var(--type-h2); letter-spacing:-.02em; margin-bottom: var(--space-4); }
    .gf-intro h2 em { font-style:normal; color:var(--identity); }
    .gf-intro p { font-size:var(--type-body-l); color:var(--ink); max-width:560px; line-height:1.75; }
    .gf-body { max-width:880px; }
    .gf-body p { font-size: var(--fs-body); color:var(--ink); line-height:1.85; margin: 0 0 var(--space-4); }
    .gf-points { margin: 0 0 var(--space-4); padding:0; list-style:none; }
    .gf-points li { font-size: var(--fs-body); color:var(--text); line-height:1.85; margin: 0 0 var(--space-3); }
    .gf-closing { margin-top: var(--space-5); font-size: var(--fs-body); color:var(--text); line-height:1.75; }

    /* ── WHY JOIN (합류하면 이런 경험을) ───────── */
    body.x-site #why-join { color:var(--ink); }
    body.x-site #why-join .sec-name { color:var(--ink); }
    body.x-site #why-join .sec-rule { background:var(--line); }
    .wj-top { margin-bottom: var(--space-7); }
    body.x-site #why-join .wj-top h2 { font-family:var(--font); font-size:var(--type-h2); font-weight:600; letter-spacing:-.02em; color:var(--ink); margin-bottom:0; }
    body.x-site #why-join .wj-top h2 em { font-style:normal; color:var(--muted); }
    body.x-site #why-join .wj-top p { font-size:var(--type-body-l); color:var(--muted); max-width:520px; line-height:1.75; }
    body.x-site #why-join .wj-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap: var(--space-4); }
    body.x-site #why-join .wj-card { padding: var(--space-6) var(--space-5); background:var(--panel-fill); border:0; border-radius:var(--radius-card); box-shadow:var(--panel-shadow); }
    body.x-site #why-join .wj-ey { font-family:var(--font); margin-bottom: var(--space-3); }
    body.x-site #why-join .wj-card h3 { font-size:var(--type-h3); font-weight:600; color:var(--ink); margin-bottom: var(--space-3); }
    body.x-site #why-join .wj-card p  { font-size:var(--type-body-l); color:var(--muted); line-height:1.75; }

    /* ── BENEFITS (복지 & 베네핏) ──────────────── */
    #benefits { background:var(--canvas); }
    #benefits .bn-header { margin-bottom: var(--space-6); }
    #benefits .bn-header h2 { font-family:var(--font); font-size:var(--type-h2); font-weight:600; letter-spacing:-.02em; margin-bottom: var(--space-4); word-break:keep-all; text-wrap:balance; color:var(--ink); }
    #benefits .bn-header h2 em { font-style:normal; color:var(--ink); }
    #benefits .bn-header p { font-size:var(--type-body-l); color:var(--ink); max-width:600px; line-height:1.75; word-break:keep-all; text-wrap:balance; }
    #benefits .bn-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap: var(--space-4); }
    @media (min-width:900px) {
      #benefits .bn-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    }
    #benefits .bn-card {
      min-width:0; padding: var(--space-5); display:flex; flex-direction:column; gap: var(--space-3);
      overflow:hidden; transform:none;
    }
    #benefits .bn-icon { width:40px; height:40px; border-radius: var(--radius-input); display:flex; align-items:center; justify-content:center;
      background:var(--glass-action); border:0; }
    #benefits .bn-icon svg { width:21px; height:21px; stroke:var(--ink); }
    #benefits .bn-ey { font-family:var(--font); font-size:var(--type-meta); font-weight:600; letter-spacing:.10em; text-transform:uppercase; color:var(--ink-2); }
    #benefits .bn-card h3 { font-size:var(--type-h3); font-weight:600; line-height:1.4; word-break:keep-all; margin:0; color:var(--ink); }
    #benefits .bn-card p { font-size:var(--type-body-l); color:var(--ink); line-height:1.65; word-break:keep-all; margin:0; }

    /* ── JOBS SECTION ──────────────────────────── */
    .jobs-cta-block { display:flex; align-items:center; }
    .jobs-cta-left h2 { font-family:var(--font); font-size:var(--type-h2); letter-spacing:-.02em; margin-bottom: var(--space-4); }
    .jobs-cta-left h2 em { font-style:normal; color:var(--identity); }
    .jobs-cta-left p { font-size:var(--type-body-l); color:var(--ink); line-height:1.75; margin-bottom: var(--space-6); max-width:560px; }
    .jobs-note { margin-top: var(--space-4); font-size:var(--type-body); color:var(--ink); }
    .jobs-note a { color:var(--ink); }

    /* ── POOL SECTION ──────────────────────────── */
    .pool-layout { display:grid; grid-template-columns:1fr 1fr; gap: var(--space-8); align-items:start; }
    .pool-left h2 { font-family:var(--font); font-size:var(--type-h2); letter-spacing:-.02em; margin-bottom: var(--space-4); }
    .pool-left h2 em { font-style:normal; color:var(--identity); }
    .pool-left p { font-size:var(--type-body-l); color:var(--ink); line-height:1.75; margin-bottom: var(--space-6); }
    #pool .pool-card { overflow:hidden; }
    #pool .pool-card-header { background:transparent; padding: var(--space-5) var(--space-6); }
    #pool .pool-card-header h3 { font-size:var(--type-h3); font-weight:600; color:var(--ink); margin-bottom: var(--space-2); }
    #pool .pool-card-header p  { font-size:var(--type-body-l); color:var(--ink-2); }
    .pool-card-items { padding: var(--space-4) var(--space-6); display:flex; flex-direction:column; }
    .pool-card-item {
      display:flex; align-items:center; gap: var(--space-3);
      padding: var(--space-3) 0; border-bottom:1px solid var(--rule);
      font-size:var(--type-body); color:var(--ink);
    }
    .pool-card-item:last-child { border-bottom:none; }
    .pool-card-item svg { width:16px; height:16px; stroke:var(--ink); fill:none; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.8; flex-shrink:0; }
    .pool-card-item strong { color:var(--text); }
    .pool-card-cta { padding: var(--space-1) var(--space-6) var(--space-5); }
    /* 카드 안 필수 항목 칸은 카드 테에서 조금 띄운다 — 칸 경계가 카드 테에 붙지 않게(칸 폭은 카드 안쪽의 90% 이상, check_language). */
    #pool .pool-card .career-required { margin-inline: var(--space-3); }
    .pool-card-btn {
      display:flex; align-items:center; justify-content:center; gap: var(--space-2);
      width:100%;
    }
    .pool-card-btn svg { width:16px; height:16px; stroke:currentColor; fill:none; stroke-linecap:round; stroke-linejoin:round; stroke-width:2; }

    /* ── FOOTER ────────────────────────────────── */
    footer { background:var(--surface-inverse); padding: var(--space-7) 0; display:flex; flex-direction:column; gap: var(--space-6); }
    .footer-top, .footer-bottom { width:min(var(--page-max), calc(100% - 2 * var(--page-gutter))); margin-inline:auto; }
    .footer-top { display:flex; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; gap: var(--space-5); }
    .footer-logo img { height:20px; width:auto; opacity:.94; display:block; }
    .footer-tagline, .footer-info, .footer-copy, .footer-links a {
      font-family:var(--font);
      font-size: var(--fs-small); line-height:1.8; letter-spacing:0;
    }
    .footer-tagline { color:var(--muted); margin-top: var(--space-3); }
    .footer-links { display:flex; gap: var(--space-5); flex-wrap:wrap; align-items:center; }
    .footer-links a { color:var(--ink); transition: color var(--t-2) var(--ease-out); }
    .footer-links a:hover { color:var(--ink); }
    .footer-bottom { border-top:1px solid var(--line); padding-top: var(--space-5); display:flex; flex-direction:column; gap: var(--space-2); }
    .footer-info { color:var(--muted); }
    .footer-copy { color:var(--muted); margin-top: var(--space-1); }

    /* ── Reveal ──────────────────────────────────
       숨김은 JS 가 살아 있을 때만 적용한다. career.js 가 404 거나 실행에 실패하면
       .visible 을 붙이는 코드가 없으므로, opacity:0 을 무조건 깔면 본문이 영구히
       사라진다(내용 없는 페이지 = 채용 공고가 안 보임). html.js 클래스는 <head> 의
       인라인 스크립트가 붙이므로, JS 미지원·차단·로드실패 시 콘텐츠가 그냥 보인다. */
    .js .reveal { opacity:0; transform:translateY(22px); transition:opacity var(--t-state) ease, transform var(--t-state) ease; }
    .js .reveal.visible { opacity:1; transform:none; }
    .js .d1{transition-delay:.10s;} .js .d2{transition-delay:.20s;} .js .d3{transition-delay:.30s;} .js .d4{transition-delay:.40s;}
    @media (prefers-reduced-motion: reduce) {
      .js .reveal { opacity:1; transform:none; transition:none; }
    }

    /* ── Responsive ────────────────────────────── */
    @media (max-width:720px) {
      #how-we-work .hww-grid,
      body.x-site #why-join .wj-grid,
      #benefits .bn-grid { grid-template-columns:1fr; }
    }
    @media (max-width:820px) {
      .nav-logo img { height:32px; }
      .nav-links { gap: var(--space-2); max-width:calc(100vw - 84px); }
      .nav-links a { font-size: var(--fs-small); letter-spacing:.03em; }
      .hero { min-height:0; padding-block:var(--section-space-mobile); }
      .wwd-grid,.pool-layout { grid-template-columns:1fr; gap: var(--space-6); }
      .footer-top { flex-direction:column; }
      .footer-logo img { height:72px; }
    }

  /* ── [design.4 · point-overlay] 아쿠아마린 포인트 전역 배선 ──────────
     링크·현재 위치 인디케이터·텍스트 링크에 포인트를 앉힌다. 주 CTA(근흑)와
     페이지 고유 스타일(특이도 높은 규칙)은 그대로 이긴다. */
.text-link, a.more, .link-arrow, .ilink { color:var(--ink); }
  .text-link:hover, a.more:hover, .link-arrow:hover, .ilink:hover { color:var(--ink); }
  main p > a:not(.btn):not([class*="btn"]), main li > a:not(.btn):not([class*="btn"]),
  article p > a:not(.btn):not([class*="btn"]), .prose a:not(.btn) { color:var(--ink); text-underline-offset:3px; }
  main p > a:not(.btn):hover, main li > a:not(.btn):hover, article p > a:not(.btn):hover { color:var(--ink); }