/* ============================================================
   BK bio · Company page (bespoke, loaded AFTER bk-elevated.css)
   Composes from the V3 system tokens. Adds only the idioms the
   shared sheet does not carry: a FILLED two-column masthead with a
   leadership / registration card, a CEO greeting, a RESTRAINED
   chronological timeline (orange reserved for the 3 real pivots),
   a GROUPED scannable certification ledger, and a tidy award block.

   DESIGN LAWS held here:
   - No gradient text. No coloured side-stripes used as decoration on
     cards. The one accent rail on a cert group encodes its category
     in the cool palette (pine / gold / basalt), never orange.
   - Bigger type everywhere (owner: "fonts too small"). Body >= 16px.
   - ORANGE IS A PIVOT MARKER, NOT DECORATION. In the 16-row timeline
     only 3 genuine pivots (2000 founded, 2015 Jeju factory, 2019 GMP)
     carry orange. Every other row stays quiet (ink + gold tick).
   - Tabular numerals on every figure. Focus rings inherited.
   ============================================================ */

/* ============================================================
   1 · MASTHEAD - filled two-column. Left: editorial headline + deck.
   Right: a framed Jeju interior photo and a designed leadership /
   registration card. No awkward empty hero whitespace.
   ============================================================ */
.mast .lede{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,3.6vw,60px);
  margin-top:34px;align-items:stretch;}
.mast .lede-l{display:flex;flex-direction:column;}
.mast .lede-l h1{font-family:var(--ff-d);font-weight:600;font-size:clamp(36px,3.6vw,52px);line-height:1.08;
  letter-spacing:-.024em;margin:0;max-width:30ch;text-wrap:balance;}
.mast .lede-l h1 em{font-style:italic;color:var(--green);font-weight:500;}
.mast .lede-l .deck-p{font-size:clamp(16px,1.2vw,18.5px);line-height:1.64;color:var(--ink-2);max-width:52ch;margin:26px 0 0;}
.mast .lede-l .deck-p b{color:var(--ink);font-weight:600;}
.mast .lede-l .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:auto;padding-top:32px;}

.mast .lede-r{display:flex;flex-direction:column;gap:18px;min-width:0;}
.mast .figure{position:relative;margin:0;border:1px solid var(--rule);background:var(--paper);
  box-shadow:0 24px 50px -34px rgba(22,20,18,.5);overflow:hidden;}
.mast .figure img{display:block;width:100%;height:clamp(196px,23vh,256px);object-fit:cover;
  filter:saturate(1.03) contrast(1.03);}
.mast .figure figcaption{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;
  align-items:center;gap:10px;padding:11px 15px;font-family:var(--ff-m);font-size:11.5px;letter-spacing:.1em;
  text-transform:uppercase;color:#fff;
  background:linear-gradient(0deg,rgba(9,26,18,.88),rgba(9,26,18,.34) 70%,transparent);}
.mast .figure figcaption b{color:var(--gold);font-weight:500;}

/* leadership / registration card - fills the formerly empty hero zone */
.idcard{border:1px solid var(--rule);background:var(--paper);padding:22px 26px;
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 44px -36px rgba(22,20,18,.42);}
.idcard .idh{display:flex;align-items:center;justify-content:space-between;gap:12px;
  border-bottom:1px solid var(--rule);padding-bottom:13px;margin-bottom:4px;}
.idcard .idh .ml{margin:0;}
.idcard .idh .stamp{font-family:var(--ff-m);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--green);border:1px solid rgba(44,106,72,.4);padding:4px 9px;border-radius:2px;white-space:nowrap;}
.idgrid{display:grid;grid-template-columns:1fr 1fr;gap:0;}
.idgrid .ic{padding:15px 0;border-bottom:1px solid var(--rule);}
.idgrid .ic:nth-child(odd){padding-right:20px;border-right:1px solid var(--rule);}
.idgrid .ic:nth-child(even){padding-left:20px;}
.idgrid .ic:nth-last-child(-n+2){border-bottom:none;}
.idgrid .ik{font-family:var(--ff-m);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);}
.idgrid .iv{font-family:var(--ff-d);font-weight:600;font-size:19px;letter-spacing:-.01em;color:var(--ink);margin-top:7px;
  font-variant-numeric:tabular-nums lining-nums;}
.idgrid .iv small{display:block;font-family:var(--ff-b);font-weight:400;font-size:13.5px;color:var(--ink-3);
  margin-top:4px;letter-spacing:0;text-transform:none;line-height:1.45;}
.idgrid .iv .kr{display:block;font-family:var(--ff-kr-b);font-weight:500;font-size:13.5px;color:var(--ink-3);
  margin-top:4px;letter-spacing:0;}
@media(max-width:960px){
  .mast .lede{grid-template-columns:1fr;gap:34px;}
  .mast .lede-l .cta{padding-top:26px;}
}
@media(max-width:560px){
  .idgrid{grid-template-columns:1fr;}
  .idgrid .ic:nth-child(odd){padding-right:0;border-right:none;}
  .idgrid .ic:nth-child(even){padding-left:0;}
  .idgrid .ic{border-bottom:1px solid var(--rule);}
  .idgrid .ic:last-child{border-bottom:none;}
}

/* ---------- CEO GREETING · restored from production introduction ---------- */
.greeting{padding:clamp(58px,7vh,96px) 56px;background:var(--paper);border-top:1px solid var(--rule);}
.greeting-grid{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(320px,1.2fr);gap:clamp(34px,6vw,84px);
  align-items:start;margin-top:18px;}
.greeting h2{font-family:var(--ff-d);font-weight:600;font-size:clamp(34px,4.2vw,64px);letter-spacing:-.026em;
  line-height:1.02;margin:0;color:var(--ink);text-wrap:balance;}
.greeting .slogan{font-family:var(--ff-d);font-size:clamp(20px,2vw,30px);font-style:italic;color:var(--green);
  margin:18px 0 0;}
.greeting-copy{border-top:2px solid var(--ink);padding-top:24px;}
.greeting-copy p{font-size:16px;line-height:1.72;color:var(--ink-2);margin:0 0 14px;}
.greeting-copy p:last-child{margin-bottom:0;}
.greeting-copy .draft-note{font-family:var(--ff-m);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent-d);margin-top:18px;}
@media(max-width:760px){
  .greeting{padding:clamp(44px,6vh,64px) 22px;}
  .greeting-grid{grid-template-columns:1fr;gap:24px;}
}

/* ============================================================
   2 · RESTRAINED TIMELINE - one colour logic.
   - Default row: neutral. Year in mono ink-3, gold tick on the rail,
     title in Spectral ink, neutral outlined tag.
   - PIVOT row (.pivot): the ONLY orange. Filled tick, accent year,
     solid orange tag. Reserved for 2000 / 2015 / 2019.
   ============================================================ */
.record{padding:clamp(64px,8vh,110px) 56px;background:var(--bg);}
.record-h{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:16px;
  border-bottom:2px solid var(--ink);padding-bottom:20px;}
.record-h h2{font-family:var(--ff-d);font-weight:600;font-size:clamp(30px,3.4vw,50px);letter-spacing:-.022em;
  margin:14px 0 0;line-height:1.02;}
.record-h h2 em{font-style:italic;color:var(--green);font-weight:500;}
.record-h .legend{display:flex;align-items:center;gap:18px;font-family:var(--ff-m);font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);flex-wrap:wrap;}
.record-h .legend .lg{display:inline-flex;align-items:center;gap:7px;}
.record-h .legend .sw{width:11px;height:11px;border-radius:50%;}
.record-h .legend .sw.piv{background:var(--accent);}
.record-h .legend .sw.std{background:var(--paper);border:1.5px solid var(--gold-d);}

.tline{margin-top:14px;position:relative;}
.tline::before{content:'';position:absolute;left:135px;top:18px;bottom:18px;width:1px;background:var(--rule);}
.trow{display:grid;grid-template-columns:120px 1fr auto;gap:30px;align-items:center;
  padding:18px 0;border-bottom:1px solid var(--rule);position:relative;transition:background .16s;}
.trow:last-child{border-bottom:none;}
.trow:hover{background:var(--bg-2);}
.trow .yr{font-family:var(--ff-m);font-size:15px;font-weight:500;letter-spacing:.02em;color:var(--ink-3);
  font-variant-numeric:tabular-nums lining-nums;}
/* rail tick sits on the vertical line at 135px (120 col + 15 of the 30 gap) */
.trow::before{content:'';position:absolute;left:131px;top:50%;transform:translateY(-50%);
  width:9px;height:9px;border-radius:50%;background:var(--paper);border:1.5px solid var(--gold-d);z-index:1;}
.trow .t{font-family:var(--ff-d);font-weight:500;font-size:18.5px;letter-spacing:-.01em;line-height:1.32;color:var(--ink);}
.trow .t em{font-style:italic;color:var(--green);}
.trow .t .sub{display:block;font-family:var(--ff-b);font-size:13.5px;font-weight:400;color:var(--ink-3);
  margin-top:5px;line-height:1.5;max-width:64ch;}
.trow .tag{font-family:var(--ff-m);font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3);border:1px solid var(--rule);padding:5px 11px;border-radius:2px;white-space:nowrap;justify-self:end;}
/* PIVOT - the only orange in the timeline */
.trow.pivot .yr{color:var(--accent-d);font-weight:600;}
.trow.pivot::before{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 4px rgba(206,74,24,.14);}
.trow.pivot .t{font-weight:600;}
.trow.pivot .tag{color:#fff;background:var(--accent);border-color:var(--accent);}
@media(max-width:680px){
  .record{padding:clamp(44px,6vh,64px) 22px;}
  .tline::before,.trow::before{display:none;}
  .trow{grid-template-columns:1fr auto;gap:4px 16px;padding:16px 0;}
  .trow .yr{grid-column:1;grid-row:1;align-self:center;font-size:14px;}
  .trow .tag{grid-column:2;grid-row:1;justify-self:end;}
  .trow .t{grid-column:1/-1;grid-row:2;font-size:17px;}
}

/* ---------- MANAGEMENT PHILOSOPHY · three pillars ---------- */
.philosophy{padding:clamp(60px,8vh,100px) 56px;background:var(--paper);}
.philosophy-h{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:16px;
  border-bottom:2px solid var(--ink);padding-bottom:20px;}
.philosophy-h h2{font-family:var(--ff-d);font-weight:600;font-size:clamp(30px,3.4vw,50px);letter-spacing:-.022em;
  margin:14px 0 0;line-height:1.02;}
.philosophy-h h2 em{font-style:italic;color:var(--green);font-weight:500;}
.pillar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:26px;}
.pillar{background:var(--bg);padding:28px 30px 32px;}
.pillar .pn{display:inline-block;font-family:var(--ff-m);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:#fff;background:var(--accent);padding:5px 10px;}
.pillar h3{font-family:var(--ff-d);font-weight:600;font-size:clamp(21px,1.8vw,27px);letter-spacing:-.012em;
  margin:18px 0 0;color:var(--ink);}
.pillar p{font-size:15px;line-height:1.62;color:var(--ink-2);margin:11px 0 0;max-width:38ch;}
@media(max-width:900px){.pillar-grid{grid-template-columns:1fr;}}
@media(max-width:760px){.philosophy{padding:clamp(44px,6vh,64px) 22px;}}

/* ============================================================
   3 · GROUPED CERT LEDGER + AWARDS - scannable in seconds.
   17 certs in 3 named categories, each with a count + larger type +
   generous row rhythm + a strong column head. 8 awards in one tidy
   block. No spreadsheet wall.
   ============================================================ */
.creds{background:var(--bg-2);padding:clamp(60px,8vh,100px) 56px;}
.creds-h{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:16px;
  border-bottom:1px solid var(--ink);padding-bottom:18px;}
.creds-h h2{font-family:var(--ff-d);font-weight:600;font-size:clamp(30px,3.4vw,50px);letter-spacing:-.022em;
  margin:14px 0 0;line-height:1.02;}
.creds-h h2 em{font-style:italic;color:var(--green);font-weight:500;}

/* summary chips - counts at a glance, cool palette (not orange) */
.certsum{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px;}
.certsum .chip{display:inline-flex;align-items:baseline;gap:9px;background:var(--paper);
  border:1px solid var(--rule);padding:12px 17px;border-radius:2px;}
.certsum .chip .n{font-family:var(--ff-d);font-weight:600;font-size:23px;color:var(--pine);line-height:1;
  font-variant-numeric:tabular-nums lining-nums;}
.certsum .chip .l{font-family:var(--ff-m);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);}
.certsum .chip.total .n{color:var(--accent-d);}     /* total only: the one warm number */

.cgroups{margin-top:32px;display:flex;flex-direction:column;gap:34px;}
.cgroup{position:relative;background:var(--paper);border:1px solid var(--rule);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 24px 50px -40px rgba(22,20,18,.4);}
/* the accent rail encodes the category WITHOUT orange (functional, not decoration) */
.cgroup::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;}
.cgroup.g-food::before{background:var(--green);}
.cgroup.g-quality::before{background:var(--gold-d);}
.cgroup.g-biz::before{background:var(--basalt);}
.cgroup .gh{display:flex;align-items:center;gap:16px;padding:19px 26px;
  border-bottom:1px solid var(--rule);background:linear-gradient(180deg,var(--bg),var(--paper));}
.cgroup .gh .gnum{font-family:var(--ff-m);font-size:12px;font-weight:500;letter-spacing:.14em;color:var(--ink-4);}
.cgroup .gh .gtitle{font-family:var(--ff-d);font-weight:600;font-size:22px;letter-spacing:-.012em;color:var(--ink);}
.cgroup .gh .gtitle small{display:block;font-family:var(--ff-b);font-weight:400;font-size:14px;
  color:var(--ink-3);letter-spacing:0;margin-top:3px;line-height:1.4;}
.cgroup .gh .gcount{margin-left:auto;font-family:var(--ff-m);font-size:12px;font-weight:500;letter-spacing:.06em;
  text-transform:uppercase;color:var(--pine);background:var(--bg-2);border:1px solid var(--rule);
  padding:6px 13px;border-radius:2px;white-space:nowrap;}

.cledger{width:100%;border-collapse:collapse;background:var(--paper);}
.cledger caption{position:absolute;left:-9999px;}
.cledger thead th{font-family:var(--ff-m);font-size:12.5px;font-weight:500;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);text-align:left;padding:14px 26px;
  border-bottom:1px solid var(--rule);background:var(--bg);}
.cledger thead th.num{text-align:right;}
.cledger tbody td{padding:17px 26px;border-bottom:1px solid var(--rule);vertical-align:baseline;}
.cledger tbody tr:last-child td{border-bottom:none;}
.cledger tbody tr:hover td{background:var(--bg-2);}
.cledger td.std{font-family:var(--ff-d);font-weight:600;font-size:16.5px;color:var(--ink);letter-spacing:-.005em;width:42%;}
.cledger td.std .rn{display:block;font-family:var(--ff-m);font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--accent-d);margin-top:5px;font-weight:500;}    /* compliance flag - informational, not a pivot */
.cledger td.iss{font-size:14.5px;color:var(--ink-3);line-height:1.45;}
.cledger td.since{font-family:var(--ff-m);font-size:14px;text-align:right;color:var(--ink-2);white-space:nowrap;
  font-variant-numeric:tabular-nums lining-nums;}

/* AWARDS - one tidy block, same table idiom, a gold rail */
.awards{margin-top:38px;}
.awards .awh{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:12px;
  border-bottom:1px solid var(--ink);padding-bottom:14px;}
.awards .awh h3{font-family:var(--ff-d);font-weight:600;font-size:clamp(22px,2vw,30px);letter-spacing:-.014em;
  margin:0;color:var(--ink);}
.awards .awh .awcount{font-family:var(--ff-m);font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;
  color:var(--gold-d);}
.awbox{margin-top:22px;position:relative;background:var(--paper);border:1px solid var(--rule);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 24px 50px -40px rgba(22,20,18,.4);}
.awbox::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gold-d);}

.cnote{font-family:var(--ff-b);font-size:13px;color:var(--ink-3);line-height:1.6;margin:24px 0 0;max-width:78ch;}
@media(max-width:760px){
  .creds{padding:clamp(44px,6vh,64px) 22px;}
  .cgroup .gh{flex-wrap:wrap;}
  .cgroup .gh .gcount{margin-left:0;}
  .cledger thead{position:absolute;left:-9999px;}
  .cledger,.cledger tbody,.cledger tr,.cledger td{display:block;width:100%;}
  .cledger tbody tr{border-bottom:1px solid var(--rule);padding:8px 0;}
  .cledger tbody tr:last-child{border-bottom:none;}
  .cledger tbody td{border-bottom:none;padding:4px 26px;}
  .cledger td.std{width:auto;padding-top:14px;}
  .cledger td.since{text-align:left;}
  .cledger td.since::before{content:'Date · ';font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-4);}
}
:lang(ko) .cledger td.since::before{content:'일자 · ';}

/* ============================================================
   4 · FIGURES SLAB (.proof.figures) - owner-picked dark treatment:
   the basalt slab with gold hairline columns (the old chain diagram's
   aesthetic), repurposed for the figures. Mono label above, white
   serif numeral below, gold rules between columns. One deliberate
   dark moment in an otherwise light dossier page.
   ============================================================ */
.proof.figures{background:var(--basalt-d);color:#EFEADE;padding:clamp(52px,7vh,88px) 56px;}
.proof.figures .glow{background:radial-gradient(circle at 55% -25%,rgba(200,162,78,.2),transparent 56%);}  /* gold-tinted, full-bleed via the base rule: no box edge */
.proof.figures .ml{color:rgba(239,234,222,.66);}
.proof.figures .ml .dot{background:var(--accent-l);}
.proof.figures .pg{margin-top:30px;}
.proof.figures .pg .pc{display:flex;flex-direction:column;border-left:1px solid rgba(200,162,78,.7);padding:4px 20px;}
.proof.figures .pg .pc:first-child{border-left:none;padding-left:0;}
.proof.figures .pg .pc .k{order:-1;margin:0 0 14px;color:rgba(239,234,222,.62);}
.proof.figures .pg .pc .v{color:#fff;font-size:clamp(30px,3vw,48px);}
@media(max-width:900px){.proof.figures .pg .pc{border-left:none;padding-left:0;}}
@media(max-width:760px){.proof.figures{padding:clamp(44px,6vh,64px) 22px;}}

/* ============================================================
   5 · PROCESS RIBBON (.spine-ribbon) - replaces the 5-column chain
   diagram on Company. The full explainer lives on the homepage; here
   the integrated model is one quiet line of steps plus a pointer.
   Overrides the shared dark .spine slab into a light dossier band.
   Honestin is marked with a gold outline tag, never orange (orange
   stays reserved for the 3 timeline pivots).
   ============================================================ */
.spine.spine-ribbon{background:var(--paper);color:var(--ink);padding:clamp(48px,6vh,84px) 56px;}
.spine-ribbon .glow{display:none;}
.spine-ribbon .sh{margin-bottom:30px;}
.spine-ribbon .sh h2{color:var(--ink);}
.spine-ribbon .sh h2 em{color:var(--green);}
.spine-ribbon .sh .ml{color:var(--ink-3);}
.pribbon{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:12px 0;margin:0;padding:24px 0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}
.pribbon li{display:inline-flex;align-items:center;font-family:var(--ff-d);font-weight:600;
  font-size:clamp(17px,1.5vw,21px);letter-spacing:-.01em;color:var(--ink);white-space:nowrap;}
:lang(ko) .pribbon li{font-family:var(--ff-kr-d);}
.pribbon li::after{content:'\2192';font-family:var(--ff-m);font-weight:400;font-size:15px;
  color:var(--gold-d);margin:0 clamp(12px,1.8vw,24px);}
.pribbon li:last-child::after{content:none;}
.pribbon .own-tag{font-family:var(--ff-m);font-size:10.5px;font-weight:500;letter-spacing:.1em;
  text-transform:uppercase;color:var(--gold-d);border:1px solid var(--gold-d);padding:3px 8px;
  margin-left:11px;border-radius:2px;}
.ribbon-link{display:inline-flex;align-items:center;gap:9px;margin-top:22px;min-height:44px;
  font-family:var(--ff-m);font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-2);border-bottom:1px solid var(--gold);transition:color .15s,border-color .15s;}
.ribbon-link:hover{color:var(--accent-d);border-color:var(--accent-d);}
.ribbon-link .arr{transition:transform .15s;}
.ribbon-link:hover .arr{transform:translateX(4px);}
.spine-ribbon :where(a):focus-visible{outline-color:var(--accent);}
@media(max-width:760px){
  .spine.spine-ribbon{padding:clamp(40px,6vh,60px) 22px;}
  .pribbon{display:block;padding:6px 0;}
  .pribbon li{display:flex;justify-content:space-between;width:100%;white-space:normal;
    padding:13px 0;border-bottom:1px solid var(--rule);}
  .pribbon li:last-child{border-bottom:none;}
  .pribbon li::after{content:'\2193';margin:0;}
  .pribbon li:last-child::after{content:none;}
  .pribbon .own-tag{margin-left:auto;margin-right:12px;}
}