/* Korean typography layer (docs/site-i18n.md). Loaded only by Korean pages,
   after the page's own styles. Latin text (brand names, numbers) keeps the
   existing fonts; Hangul falls through to Saram Sans KR / Saram Serif KR
   (self-hosted subsets of Pretendard and Noto Serif KR), which the builder
   lists immediately after each Latin family. Never loaded by English pages. */

/* Pages styled by /site.css and /site-chrome.css (academies, investors) take their fonts from
   these tokens, which the builder cannot rewrite inside an external file. Same Latin faces,
   with the Korean subset listed right after each one. */
:root:lang(ko){
  --sans:"Inter",'Saram Sans KR',-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --serif:"Source Serif 4",'Saram Serif KR',Georgia,"Times New Roman",serif;
  --mono:'Saram Sans KR',"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;   /* Korean first: the mono space glyph is too wide between Korean words */
}

/* Hangul reads best with neutral tracking and a little more leading than Latin */
:root:lang(ko) body{letter-spacing:0;word-break:keep-all;overflow-wrap:break-word;line-break:strict}

/* opening */
:lang(ko) .signin-copy h1{letter-spacing:-.025em;line-height:1.24;font-weight:700}
:lang(ko) .signin-copy .sub{line-height:1.62;font-size:22px}
/* a short highlighted phrase reads better whole in Korean */
:lang(ko) .signin-copy .sub mark{white-space:nowrap}
@media (max-width:700px){
  :lang(ko) .signin-copy .sub{font-size:19px}
  /* the English line breaks suit English; on phones Korean wraps evenly by phrase */
  :lang(ko) .signin-copy h1 br{display:none}
  :lang(ko) .signin-copy h1{text-wrap:balance}
}

/* section heading and editorial leads (inline styles in the page, hence !important) */
:lang(ko) .products-block h2{letter-spacing:-.03em !important;line-height:1.16 !important;max-width:12ch !important}
:lang(ko) .products-block [data-layer="-0.35"]{line-height:1.5 !important;letter-spacing:-.01em;text-wrap:balance !important}
:lang(ko) .products-block p[style*="font-weight:300"]{line-height:1.7 !important}
:lang(ko) .products-block [data-body] p{line-height:1.85 !important;letter-spacing:-.003em}
:lang(ko) .products-block figcaption{line-height:1.7 !important}
:lang(ko) .products-block [data-reveal] > p[style*="max-width:34ch"],
:lang(ko) .products-block article p[style*="max-width:34ch"]{line-height:1.6 !important}

/* index and labels: the mono face has no Hangul, and uppercase does nothing in Korean */
:lang(ko) .pb-card__state,
:lang(ko) .products-block .pb-eyebrow{font-family:'Saram Sans KR',var(--sans);font-size:12.5px;letter-spacing:.01em;font-weight:500}
:lang(ko) .products-block .pb-card p{line-height:1.7}

/* the practical passage, synthesis and closing */
:lang(ko) .pb-begin h3{letter-spacing:-.025em;line-height:1.3;max-width:20ch}
:lang(ko) .pb-together h3{letter-spacing:-.025em;line-height:1.25}
:lang(ko) .products-block .pb-together__lead{line-height:1.7}
:lang(ko) .products-block .pb-together__body,
:lang(ko) .products-block .pb-begin__body{line-height:1.85}
:lang(ko) .products-block .pb-closer{letter-spacing:-.03em;line-height:1.25;font-size:clamp(1.75rem,3.3vw,3rem)}
:lang(ko) .pb-closer span{max-width:17ch}
@media (min-width:1000px){ :lang(ko) .pb-closer span{max-width:none} }

/* menu and footer */
:lang(ko) #site-nav .mega-primary a{letter-spacing:-.02em}
:lang(ko) .site-footer .biz{line-height:1.75}

/* /site.css pages (academies, investors): `ch` is the width of "0", and a Hangul syllable is
   about 1.7x that, so the Latin 20ch measure breaks Korean headlines mid-phrase */
:lang(ko) .page-hero h1{max-width:16em;text-wrap:balance;letter-spacing:-.02em;line-height:1.3}
:lang(ko) .page-hero h1 + p,:lang(ko) .lead{line-height:1.75}

/* Thesis: labels tracked for Latin capitals (.1em to .26em) spread Hangul syllables apart.
   Numerals-only labels (.s-n, .idx-num, years) keep their tracking. */
:lang(ko) .thesis-doc .eyebrow, :lang(ko) .thesis-doc .mono, :lang(ko) .thesis-doc .kicker,
:lang(ko) .thesis-doc .belt-head, :lang(ko) .thesis-doc .belt-head .mid, :lang(ko) .thesis-doc .belt-hint,
:lang(ko) .thesis-doc .belt .s-t, :lang(ko) .thesis-doc .belt .s-d,
:lang(ko) .thesis-doc .cell--final, :lang(ko) .thesis-doc .cell--mono, :lang(ko) .thesis-doc .purpose,
:lang(ko) .thesis-doc .sec .snum, :lang(ko) .thesis-doc .sec .mono, :lang(ko) .thesis-doc .sec .signal,
:lang(ko) .thesis-doc .sec .signals, :lang(ko) .thesis-doc .sec strong.plex,
:lang(ko) .thesis-doc .sec ul.principles b, :lang(ko) .thesis-doc .src .note,
:lang(ko) .thesis-doc .tkod-mark, :lang(ko) .thesis-doc .tkod-loop, :lang(ko) .thesis-doc .fw .fw-chapter h3{letter-spacing:.01em}
:lang(ko) .thesis-doc .cell--final .ln{letter-spacing:-.005em;line-height:1.5}
:lang(ko) .thesis-doc .cell{line-height:1.6}

/* Labels tracked for Latin capitals, wherever they carry Korean: shared menu and footer labels,
   and the Saram OS page's own interface. (The English demo screens use .m-* classes, which
   this rule does not touch, so they keep their tracking.) */
:lang(ko) .eyebrow, :lang(ko) .mega-group-title, :lang(ko) .feature-kicker, :lang(ko) .mono,
:lang(ko) .site-footer .now, :lang(ko) .os-status__k, :lang(ko) .osx-status, :lang(ko) .osx-cap,
:lang(ko) .osx-card-k, :lang(ko) .osx-flow, :lang(ko) .m-step{letter-spacing:.01em}

/* ===== Environment Partnerships (/existing-environments) =====
   Labels here are set in mono capitals with .09em to .16em tracking (several with !important);
   in Korean that spreads syllables apart, so the tracking goes back to neutral. */
:lang(ko) .label, :lang(ko) .meter__legend span{letter-spacing:.01em !important}
:lang(ko) .phase__mark, :lang(ko) .lbl, :lang(ko) .plate-mark__label, :lang(ko) .plate-point span,
:lang(ko) .ledger__label, :lang(ko) .chart__unit, :lang(ko) .chart__group, :lang(ko) .floor__rail-label,
:lang(ko) .floor__state, :lang(ko) .floor__now, :lang(ko) .bline__phase, :lang(ko) .bline__tag,
:lang(ko) .artefact__id, :lang(ko) .artefact__deliv, :lang(ko) .feed__cap, :lang(ko) .loop__sub,
:lang(ko) .loop__note, :lang(ko) .agal__count, :lang(ko) .agal__tick span, :lang(ko) .plate-head span{letter-spacing:.01em}
/* SVG map labels: capitals in English; Korean words are short, so a touch larger and untracked */
:lang(ko) .map-label, :lang(ko) .environment-label{letter-spacing:.02em;font-weight:500}
/* and about a fifth larger, matching each size step the page sets for the capitals */
:lang(ko) .map-label{font-size:12.5px}
:lang(ko) .environment-label{font-size:13px}
@media (min-width:62.01rem) and (max-width:80rem){ :lang(ko) .map-label, :lang(ko) .environment-label{font-size:15px} }
@media (max-width:62rem){ :lang(ko) .map-label{font-size:18px} :lang(ko) .environment-label{font-size:17px} }
/* headings: Latin display tracking crowds Hangul */
:lang(ko) .band h2, :lang(ko) .statement, :lang(ko) .agal-close__lead, :lang(ko) .vto__title,
:lang(ko) .floor__title, :lang(ko) .history__open h2, :lang(ko) .agal-intro h2,
:lang(ko) .capacity-thesis__line span, :lang(ko) .memory-prompt{letter-spacing:-.022em}
:lang(ko) .hero__title{max-width:11.5em;text-wrap:balance}
:lang(ko) .hero__lede, :lang(ko) .agal-intro__text p, :lang(ko) .phase p, :lang(ko) .faq p,
:lang(ko) .narrow p, :lang(ko) .os-layers dd, :lang(ko) .os-now dd{line-height:1.75}
:lang(ko) .faq summary{line-height:1.5}
:lang(ko) .capacity-thesis__line{line-height:1.12}
/* no single word left alone on a paragraph's last line */
:lang(ko) main p, :lang(ko) main dd{text-wrap:pretty}

/* ---- Feed mockups (i18n/ko/existing-environments-feeds.mjs). Sized in container units, so
   each phone scales as one picture, like the screenshots they replace. */
.kf{container-type:inline-size;position:relative;color:#1B1B1A;font-family:'Saram Sans KR',var(--display);
  line-height:1.25;letter-spacing:-.01em;word-break:keep-all}
.kf__screen{position:absolute;inset:0;display:flex;flex-direction:column}
.kf b{font-weight:700}
.kf__status{display:flex;justify-content:space-between;align-items:center;padding:4.2cqw 7cqw 0 9cqw;font-size:4.4cqw}
.kf__bars{display:inline-flex;align-items:flex-end;gap:.7cqw;height:3cqw}
.kf__bars i{width:1cqw;background:#1B1B1A;border-radius:.3cqw}
.kf__bars i:nth-child(1){height:35%}.kf__bars i:nth-child(2){height:55%}.kf__bars i:nth-child(3){height:78%}.kf__bars i:nth-child(4){height:100%}
.kf__top{display:flex;align-items:center;gap:4cqw;padding:6cqw 5cqw 3cqw;font-size:5.4cqw}
.kf__top b{flex:1;letter-spacing:-.02em}
.kf__back{width:3cqw;height:3cqw;border-left:.7cqw solid #1B1B1A;border-bottom:.7cqw solid #1B1B1A;transform:rotate(45deg);margin-left:1.5cqw}
.kf__bell{width:4.2cqw;height:4.6cqw;border:.6cqw solid #1B1B1A;border-radius:2.2cqw 2.2cqw .6cqw .6cqw}
.kf__dots{font-size:5cqw;letter-spacing:0;line-height:1}
.kf__profile{display:flex;align-items:center;gap:5cqw;padding:2cqw 4cqw}
.kf__avatar{flex:none;display:grid;place-items:center;width:22cqw;height:22cqw;border-radius:50%}
.kf__avatar--book{background:#FBF1D9;border:.5cqw solid #EDE3CB}
.kf__avatar--book i{width:10cqw;height:6cqw;border:.6cqw solid #2C4A7A;border-top-width:0;border-radius:0 0 1.5cqw 1.5cqw;position:relative}
.kf__avatar--book i::before{content:"";position:absolute;left:50%;top:-5cqw;width:3.5cqw;height:4.5cqw;background:#6F9A55;border-radius:3cqw 0;transform:translateX(-30%) rotate(-20deg)}
.kf__avatar--ring{border:.9cqw solid #C77B5A;padding:1.2cqw;background:#F4EFE6 content-box}
.kf__avatar--ring b{font-size:5.2cqw;letter-spacing:-.03em}
.kf__who{flex:1;min-width:0;display:flex;flex-direction:column;gap:2cqw}
.kf__who > b{font-size:4.4cqw}
.kf__counts{display:flex;justify-content:space-between;font-size:3.3cqw;color:#2B2B28}
.kf__counts span{display:flex;flex-direction:column;gap:.5cqw}
.kf__counts b{font-size:4.6cqw}
.kf__bio{display:flex;flex-direction:column;gap:1cqw;padding:2.5cqw 4cqw 0;font-size:3.5cqw}
.kf__cat{color:#7A7A75}
.kf__buttons{display:flex;gap:1.5cqw;padding:3.5cqw 3cqw 0}
.kf__buttons span{flex:1;padding:2.2cqw 0;text-align:center;border-radius:2cqw;background:#EFEFEC;font-size:3.6cqw;font-weight:600}
.kf__buttons .is-primary{background:#4458E6;color:#FFFFFF}
.kf__highlight{display:flex;flex-direction:column;align-items:center;gap:1.2cqw;width:20cqw;padding:4cqw 0 0 3cqw;font-size:3cqw}
.kf__sun{width:15cqw;height:15cqw;border-radius:50%;background:radial-gradient(circle,#F6CF57 0 30%,#CFE3F4 31%);border:.5cqw solid #D9D9D4}
.kf__tabs{display:flex;margin-top:3.5cqw;border-bottom:.25cqw solid #E4E4E0}
.kf__tabs span{flex:1;display:grid;place-items:center;padding:2.6cqw 0}
.kf__tabs i{width:4.6cqw;height:4.6cqw;border:.6cqw solid #3A3A37;border-radius:1cqw}
.kf__tabs span{border-bottom:.6cqw solid transparent}
.kf__tabs .is-on{border-bottom-color:#1B1B1A}
.kf__tabs .is-on i{border:none;background:conic-gradient(#1B1B1A 0 0) 0 0/1.3cqw 1.3cqw,conic-gradient(#1B1B1A 0 0) 50% 0/1.3cqw 1.3cqw,conic-gradient(#1B1B1A 0 0) 100% 0/1.3cqw 1.3cqw,
  conic-gradient(#1B1B1A 0 0) 0 50%/1.3cqw 1.3cqw,conic-gradient(#1B1B1A 0 0) 50% 50%/1.3cqw 1.3cqw,conic-gradient(#1B1B1A 0 0) 100% 50%/1.3cqw 1.3cqw,
  conic-gradient(#1B1B1A 0 0) 0 100%/1.3cqw 1.3cqw,conic-gradient(#1B1B1A 0 0) 50% 100%/1.3cqw 1.3cqw,conic-gradient(#1B1B1A 0 0) 100% 100%/1.3cqw 1.3cqw;background-repeat:no-repeat}
.kf__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5cqw;margin-top:.4cqw}
.kf__t{position:relative;aspect-ratio:1;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:3.4cqw 3.2cqw}
/* photographs: a crop of the existing screenshot, scaled so --c source pixels fill the tile */
.kf__t--photo{padding:0;background:#D9D6CF url(/assets/build/feed-hanul.webp) no-repeat;
  background-size:calc(72000% / var(--c)) auto;
  background-position:calc(var(--x) / (720 - var(--c)) * 100%) calc(var(--y) / (1600 - var(--c)) * 100%)}
/* the plain feed: pastel cards, rounded hand-drawn feel */
.kf__hand{margin:0;font-weight:800;font-size:5cqw;line-height:1.18;letter-spacing:-.03em;color:#2C4A7A}
.kf__hand--s{font-size:4.3cqw}
.kf__hand em{font-style:normal;color:#E0607E}
.kf__t--pink{background:#FBE3E6}.kf__t--pink .kf__hand{color:#C2476A}
.kf__t--paper{background:#F4EFE6}
.kf__t--lemon{background:#FBF0C4}.kf__t--lemon .kf__hand{color:#2E5B8C}
.kf__t--blush{background:#FDEDEF}
.kf__t--cream{background:#FFF8EA}.kf__t--cream .kf__hand{color:#1F3D72}
.kf__t--note{background:#FFFFFF;border:.3cqw solid #EDEDE8}
.kf__t--ink{background:#3A3328}.kf__t--ink .kf__hand{color:#F7E7C6}
.kf__t--mint{background:#D9EEDF}.kf__t--mint .kf__hand{color:#2C6A4F}
.kf__small{font-size:2.5cqw;color:#5D6B7A;font-weight:600}
.kf__books{display:flex;flex-direction:column;gap:.5cqw;align-self:flex-end;width:60%}
.kf__books i{height:2.4cqw;border-radius:.6cqw;background:#C9584E}.kf__books i:nth-child(2){background:#3E6BA8;width:88%;margin-left:6%}.kf__books i:nth-child(3){background:#D9A441}
.kf__books--up{flex-direction:row;align-items:flex-end;width:auto;align-self:center;gap:1cqw}
.kf__books--up i{width:4cqw;height:9cqw}.kf__books--up i:nth-child(2){height:11cqw;width:4cqw;margin:0}.kf__books--up i:nth-child(3){height:8cqw}
.kf__bubble{align-self:flex-start;padding:1.4cqw 2.4cqw;border-radius:3cqw;background:#FFFFFF;font-size:2.6cqw;color:#3A3A37}
.kf__check{display:flex;flex-direction:column;gap:1cqw;font-size:2.8cqw;color:#3A3A37}
.kf__check i{font-style:normal}.kf__check i::before{content:"";display:inline-block;width:2.2cqw;height:2.2cqw;margin-right:1.2cqw;border:.35cqw solid #3A3A37;border-radius:.4cqw;vertical-align:-.2cqw}
/* the academy's feed: its own type, set like its posts */
.kf__serif{margin:0;font-family:'Saram Serif KR',serif;font-weight:500;font-size:4.4cqw;line-height:1.3;letter-spacing:-.02em;color:#1B1B1A}
.kf__serif--l{font-size:5.2cqw}
.kf__foot{font-size:2.4cqw;color:#5E5D59;line-height:1.35}
.kf__rule{display:block;width:5cqw;height:.3cqw;background:#3A3A37;margin-top:auto;margin-bottom:1.6cqw}
.kf__t--stone{background:#CBC6BA}
.kf__t--navy{background:#22314A}.kf__t--navy .kf__serif{color:#F1ECE1}.kf__t--navy .kf__foot{color:#B9C1CF}
.kf__t--sage{background:#DCE3D3}
.kf__t--shelf{background:#141414}.kf__t--shelf .kf__serif{color:#F1ECE1}.kf__t--shelf .kf__foot{color:#A9A79F}
.kf__spines{display:flex;gap:.8cqw;align-items:flex-end;height:10cqw}
.kf__spines i{flex:1;border-radius:.4cqw;background:#D9573F;height:80%}
.kf__spines i:nth-child(2){background:#E8C547;height:100%}.kf__spines i:nth-child(3){background:#3F8C6E;height:70%}
.kf__spines i:nth-child(4){background:#D97F9E;height:90%}.kf__spines i:nth-child(5){background:#4C77B8;height:75%}.kf__spines i:nth-child(6){background:#EFE9DC;height:95%}
.kf__quote{font-family:'Saram Serif KR',serif;font-size:7cqw;line-height:.6;color:#B0654A}
.kf__t--sheet{background:#FBFAF6;justify-content:flex-start;gap:2.6cqw}
.kf__label{margin:0;font-size:3.3cqw;font-weight:700}
.kf__label span{font-weight:400;color:#7A7A75;font-size:2.5cqw;margin-left:1cqw}
.kf__write{margin:0;font-family:'Newsreader','Saram Serif KR',serif;font-style:italic;font-size:3cqw;line-height:1.45;color:#2B4C7E;
  background:linear-gradient(#C9D3E0,#C9D3E0) 0 100%/100% .25cqw repeat-y;background-size:100% 1.5em;background-image:repeating-linear-gradient(transparent 0 calc(1.5em - .25cqw),#C9D3E0 calc(1.5em - .25cqw) 1.5em)}
