/* =====================================================================================================
   company.css — 회사 소개 /company/about/ · 팀 /company/team/ · 채용 /company/careers/   (03e §6, as of 2026-10-12)
   Loaded after solution.css and reuses its parts: section scaffold (.sol-sec/.sol-head/.sol-lead/.stamp), .g2–.g4,
   .split, .scard, .nlist, .row-cta, .tiles/.tile + .not-box (night band), .dtable in .table-wrap(--stack), callouts,
   .steps, .faq, footnotes + .sol-refs, .sol-nav, .st status chips, .smark survey mark, .sol-cta closing band.
   Behaviour comes from solution.js (offset anchors, local nav, FAQ hash, stepper line, closing route); no company.js.
   Page meta: "css": ["solution.css","company.css"], "js": ["solution.js"], "headerGlass": false, "bodyClass": "sol sol-company"
   Rules: main.css tokens only · --signal only on night surfaces · no number, person, partner or date the company has
   not given us — a status chip (.st) or 「확정 후 게재」 instead · .ph only in the 회사 정보 facts and the 「예시 형식」 card.
   -----------------------------------------------------------------------------------------------------
   HERO (H-NARROW)  section.co-hero#top[aria-labelledby=<h1 id>] > canvas.topo-bg[data-topo][data-palette=paper]
                      + .co-frame[aria-hidden] > i + i   (frame edges rising from the section edge, scale ticks, 2 nodes)
                      + .wrap.co-hero__in > .co-hero__copy (nav.co-crumbs, p.eyebrow, h1[data-split], p.co-hero__deck,
                      .co-hero__ctas > a.btn + a.btn.btn--line)
                      + aside.co-spec[aria-labelledby] > span.smark.smark--ink[aria-hidden][style="--x:100%;--y:0"] > i
                      + p.co-spec__k#id (span [+ time]) + dl > div > dt + dd          (the survey mark sits on the card corner)
   CRUMBS           nav.co-crumbs[aria-label="현재 위치"] > ol > li > a | li[aria-current=page]   — first item 「greenMRV」
   PLACEHOLDER      span.ph — a fact the company still has to confirm (same look as legal.css)
   BACKBONE         .co-spine > p.co-spine__k + ol.co-spine__flow > li(.is-core) > b + span ; + p.co-spine__more
   PRINCIPLES       section.sol-sec.dark.co-pr > .tiles > article.tile > span.tile__ic(01–06) + h3 + p
                      [+ p.co-pending > span.chip + text] [+ p.co-tile-link > a.text-link] ; then div.not-box#not-doing
   FACTS            dl.co-facts > div > dt + dd ; ul.co-list > li > div(b + span.co-list__d) + span.st
   PROFILE FORMAT   figure.co-pfig > div.co-pcard[role=group][aria-label] (span.co-pcard__tag 「예시 형식」, span.co-pcard__av,
                      .co-pcard__id > p.co-pcard__name + p.co-pcard__role, dl.co-pcard__dl > div > dt + dd) + figcaption
   EMPTY STATE      .co-empty > div (p.co-empty__k, h3, p, ul.co-fields > li) + div (h3.co-empty__h, p, a.btn)
   FIXED TEXT       p.co-fixed — verbatim policy wording (공정 채용 원칙)
   HELPERS          .co-gap (space under an h2 outside .sol-head) · .co-actions · .co-more · .co-checks · .co-legend · .scard.co-ghost
   ===================================================================================================== */

/* ---------- Hero: H-NARROW (limestone, topo texture, frame edges, one survey mark) ---------- */
.co-hero{--co-pb:clamp(56px,7vw,104px);position:relative;background:var(--paper);color:var(--ink);
  padding-top:calc(env(safe-area-inset-top,0px) + 136px);padding-bottom:var(--co-pb);border-bottom:1px solid var(--rule-2)}
.co-hero .topo-bg{-webkit-mask-image:linear-gradient(100deg,transparent 28%,#000 78%);mask-image:linear-gradient(100deg,transparent 28%,#000 78%)}
/* frame edges of the 12-column grid rise from the section edge (below the content, never touching text) + scale ticks + nodes */
.co-frame{position:absolute;left:0;right:0;bottom:0;height:var(--co-pb);max-width:var(--maxw);margin-inline:auto;pointer-events:none;z-index:1}
.co-frame::before{content:"";position:absolute;left:var(--margin);right:var(--margin);top:20px;bottom:0;border-left:1px solid var(--rule-2);border-right:1px solid var(--rule-2)}
.co-frame::after{content:"";position:absolute;left:var(--margin);right:var(--margin);bottom:0;height:7px;
  background:repeating-linear-gradient(90deg,var(--rule-2) 0 1px,transparent 1px 12px)}
.co-frame i{position:absolute;bottom:-4px;width:7px;height:7px;background:var(--brand)}
.co-frame i:first-child{left:calc(var(--margin) - 3px)}
.co-frame i:last-child{right:calc(var(--margin) - 3px)}
.co-hero > .wrap{position:relative;z-index:2}
.co-hero__in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:36px clamp(32px,6vw,112px);align-items:end}
.co-hero__copy{min-width:0}
.co-crumbs ol{display:flex;flex-wrap:wrap;gap:6px 8px;list-style:none;margin:0;padding:0;font-size:13.5px;line-height:1.5;color:var(--ink-2)}
.co-crumbs li+li::before{content:"›";content:"›" / "";margin-right:8px;color:var(--ink-3)}
.co-crumbs a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule-2)}
.co-crumbs a:hover{border-bottom-color:currentColor}
.co-crumbs [aria-current]{color:var(--ink)}
.co-hero .eyebrow{margin-top:28px}
.co-hero h1{font-size:clamp(32px,4.2vw,60px);line-height:1.16;letter-spacing:-.036em;font-weight:660;margin-top:16px;max-width:14.5em}
.co-hero__deck{margin-top:20px;font-size:var(--fs-lead);line-height:1.66;color:var(--ink-2);max-width:35em}
.co-hero__ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.co-spec{position:relative;min-width:0;background:var(--card);border:1px solid var(--rule-2);border-radius:var(--r-m);padding:16px 20px 6px;
  box-shadow:0 24px 48px -38px rgba(10,42,30,.5)}
.co-spec__k{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;padding-bottom:12px;border-bottom:1px solid var(--rule);
  font:500 12px/1.4 var(--font-mono);color:var(--forest);word-spacing:-.25em}
.co-spec__k time{color:var(--ink-2)}
.co-spec dl{margin:0}
.co-spec dl > div{display:grid;grid-template-columns:minmax(0,6.6em) minmax(0,1fr);gap:2px 14px;padding:11px 0;border-bottom:1px solid var(--rule)}
.co-spec dl > div:last-child{border-bottom:0}
.co-spec dt{font-size:13px;line-height:1.55;color:var(--ink-2)}
.co-spec dd{margin:0;min-width:0;font-size:14.5px;line-height:1.55;color:var(--ink)}
.co-spec dd a{color:var(--ink);text-underline-offset:3px}
.co-spec dd .st{margin-right:6px}
@media (max-width:900px){
  .co-hero{padding-top:calc(env(safe-area-inset-top,0px) + 112px)}
  .co-hero__in{grid-template-columns:minmax(0,1fr);align-items:start}
  .co-hero .topo-bg{-webkit-mask-image:linear-gradient(180deg,transparent 20%,#000 90%);mask-image:linear-gradient(180deg,transparent 20%,#000 90%)}
  .co-spec{max-width:560px}
}
@media (max-width:520px){
  .co-hero__ctas .btn{flex:1 1 auto}
  .co-spec{padding-inline:16px}
  .co-spec dl > div{grid-template-columns:minmax(0,1fr)}
}


/* ---------- Placeholders, status legend, helpers ---------- */
.ph{color:var(--ink);background:var(--mist);border-bottom:1px dashed var(--forest);border-radius:2px;padding:0 4px;font-weight:500;
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
.co-legend{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13px;line-height:1.6;color:var(--ink-2)}
.co-legend > span{display:inline-flex;align-items:center;gap:8px}
.co-gap{margin-top:18px}
.co-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.co-more{margin-top:24px;font-size:15px;line-height:1.7;color:var(--ink-2)}
.co-checks{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:10px}
.co-checks li{position:relative;padding-left:20px;font-size:15px;line-height:1.65;color:var(--ink-2)}
.co-checks li::before{content:"";position:absolute;left:0;top:10px;width:6px;height:6px;background:var(--forest)}
.sol-company .callout--note > p:not(.callout__k){margin-top:12px;font-size:15px;line-height:1.7;color:var(--ink-2)}
.sol-company .scard.co-ghost{background:transparent;border:1.5px dashed var(--rule-2)}

/* ---------- About: mission ---------- */
.co-mission .sol-head{margin-bottom:clamp(28px,3.4vw,44px)}
.co-mission__body p{font-size:var(--fs-lead);line-height:1.72;color:var(--ink-2);max-width:32em}

/* ---------- About: one measurement backbone (input → engine → outputs) ---------- */
.co-spine{margin-top:clamp(28px,3.4vw,44px);padding:clamp(18px,2.2vw,28px);background:var(--card);border-radius:var(--r-m)}
.co-spine__k{display:flex;align-items:center;gap:8px;margin-bottom:16px;font:500 12px/1.3 var(--font-mono);color:var(--forest);word-spacing:-.25em}
.co-spine__k::before{content:"";width:7px;height:7px;background:var(--brand);flex:none}
.co-spine__flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr);gap:30px}
.co-spine__flow li{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0;padding:16px 18px;border:1px solid var(--rule);border-radius:var(--r-s);background:var(--paper)}
.co-spine__flow li + li::before{content:"";position:absolute;left:-25px;top:50%;width:19px;height:1.5px;background:var(--ink-2);transform:translateY(-50%)}
.co-spine__flow li + li::after{content:"";position:absolute;left:-12px;top:50%;width:7px;height:7px;border-top:1.5px solid var(--ink-2);border-right:1.5px solid var(--ink-2);transform:translateY(-50%) rotate(45deg)}
.co-spine__flow b{font-size:16px;font-weight:650;line-height:1.4}
.co-spine__flow span{font-size:14px;line-height:1.6;color:var(--ink-2)}
.co-spine__flow .is-core{background:var(--brand);border-color:var(--brand);color:#fff}
.co-spine__flow .is-core span{color:#D3E6D9}
.co-spine__more{margin-top:18px;font-size:15px;line-height:1.7;color:var(--ink-2)}
@media (max-width:900px){
  .co-spine__flow{grid-template-columns:minmax(0,1fr);gap:28px}
  .co-spine__flow li + li::before{left:50%;top:-23px;width:1.5px;height:18px;transform:translateX(-50%)}
  .co-spine__flow li + li::after{left:50%;top:-12px;transform:translateX(-50%) rotate(135deg)}
}

/* ---------- About: principles band (night) ---------- */
.co-pr > .topo-bg{opacity:.5}
.co-pr > .wrap{position:relative}
.co-pr .tile__ic{font:500 13px/1 var(--font-mono);letter-spacing:.02em}
.tile .co-pending{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:auto;padding-top:14px;border-top:1px solid rgba(234,242,236,.14);
  font-size:14px;line-height:1.6;color:var(--on-night-2)}
.tile .co-tile-link{margin-top:auto;padding-top:6px;font-size:14.5px}

/* ---------- About: footprint ---------- */
.co-fp .co-legend{margin-top:14px}
.co-fp__notes{margin-top:clamp(28px,3.4vw,44px)}

/* ---------- About: company facts ---------- */
.co-facts{margin:16px 0 0;padding:4px 22px;background:var(--card);border:1px solid var(--rule);border-radius:var(--r-m)}
.co-facts > div{display:grid;grid-template-columns:minmax(0,8.5em) minmax(0,1fr);gap:2px 20px;padding:14px 0;border-bottom:1px solid var(--rule)}
.co-facts > div:last-child{border-bottom:0}
.co-facts dt{font-size:14px;line-height:1.6;color:var(--ink-2)}
.co-facts dd{margin:0;min-width:0;font-size:15.5px;line-height:1.6;font-weight:500}
.co-list{list-style:none;margin:16px 0 0;padding:0}
.co-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;align-items:start;padding:16px 0;border-top:1px solid var(--rule)}
.co-list li:last-child{border-bottom:1px solid var(--rule)}
.co-list b{display:block;font-size:16px;font-weight:650;line-height:1.45}
.co-list__d{display:block;margin-top:4px;font-size:15px;line-height:1.7;color:var(--ink-2)}
@media (max-width:520px){
  .co-facts{padding:2px 16px}
  .co-facts > div{grid-template-columns:minmax(0,1fr)}
  .co-list li{grid-template-columns:minmax(0,1fr)}
  .co-list .st{justify-self:start}
}

/* ---------- Team: profile card format (one clearly-labelled example, never a person) ---------- */
.co-pfig{margin:0;display:grid;gap:14px;min-width:0}
.co-pcard{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr);gap:16px 18px;align-items:center;padding:clamp(20px,2.4vw,30px);
  background:var(--card);border:1.5px dashed var(--rule-2);border-radius:var(--r-m)}
.co-pcard__tag{position:absolute;right:14px;top:14px;display:inline-flex;align-items:center;height:24px;padding:0 8px;border-radius:3px;
  background:var(--ink);color:#fff;font:600 12px/1 var(--font-sans);letter-spacing:.02em}
.co-pcard__av{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--paper-2);border:1.5px dashed var(--forest);
  font:500 11px/1.2 var(--font-mono);color:var(--ink-2)}
.co-pcard__id{min-width:0;padding-right:84px}
.co-pcard__name{font-size:clamp(18px,1.5vw,21px);font-weight:650;line-height:1.5}
.co-pcard__role{margin-top:4px;font-size:14.5px;line-height:1.55;color:var(--ink-2)}
.co-pcard__dl{grid-column:1/-1;margin:4px 0 0;display:grid}
.co-pcard__dl > div{display:grid;grid-template-columns:minmax(0,7.5em) minmax(0,1fr);gap:2px 14px;padding:11px 0;border-top:1px solid var(--rule);font-size:14.5px;line-height:1.6}
.co-pcard__dl dt{font-size:13.5px;color:var(--ink-2)}
.co-pcard__dl dd{margin:0;min-width:0}
.co-pfig figcaption{font-size:13.5px;line-height:1.6;color:var(--ink-2)}
@media (max-width:520px){
  .co-pcard{grid-template-columns:52px minmax(0,1fr)}
  .co-pcard__tag{position:static;grid-column:1/-1;justify-self:start}
  .co-pcard__av{width:52px;height:52px}
  .co-pcard__id{padding-right:0}
  .co-pcard__dl > div{grid-template-columns:minmax(0,1fr)}
}

/* ---------- Careers: empty state, fixed policy text ---------- */
.co-empty{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);border:1.5px dashed var(--rule-2);border-radius:var(--r-m);background:var(--card);overflow:hidden}
.co-empty > div{min-width:0;padding:clamp(22px,3vw,40px)}
.co-empty > div + div{border-left:1px dashed var(--rule-2);background:var(--paper)}
.co-empty__k{display:flex;align-items:center;gap:8px;font:500 12px/1.3 var(--font-mono);color:var(--forest);word-spacing:-.25em}
.co-empty__k::before{content:"";width:7px;height:7px;border:1.5px solid currentColor;transform:rotate(45deg);flex:none}
.co-empty h3{margin-top:14px;font-size:clamp(22px,2.1vw,30px);line-height:1.3;letter-spacing:-.022em}
.co-empty .co-empty__h{margin-top:0;font-size:clamp(18px,1.5vw,21px);letter-spacing:-.015em}
.co-empty p{margin-top:12px;font-size:15.5px;line-height:1.7;color:var(--ink-2)}
.co-empty .btn{margin-top:20px}
.co-fields{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.co-fields li{font:500 13px/1 var(--font-sans);padding:7px 10px;border:1px solid var(--rule-2);border-radius:var(--r-xs);background:var(--paper)}
.co-fixed{margin:0;padding:4px 0 4px clamp(16px,2vw,24px);border-left:3px solid var(--brand);font-size:clamp(19px,1.65vw,24px);line-height:1.62;
  letter-spacing:-.014em;font-weight:500;color:var(--ink);max-width:30em}
.co-join{margin-bottom:0}
@media (max-width:760px){.co-empty{grid-template-columns:minmax(0,1fr)}.co-empty > div + div{border-left:0;border-top:1px dashed var(--rule-2)}}

@media (forced-colors:active){.ph{border:1px dashed CanvasText}.co-frame i,.co-spine__k::before{forced-color-adjust:none}}
@media print{.co-hero .topo-bg,.co-frame,.sol-nav{display:none!important}.ph{background:none;border:1px dashed #666}}
