/*
 * kkbc-hero-type-1.css - typing cursor and Korean line break of the home hero (finding S7, task H6, 2026-10-13).
 * Loaded after css/kkbc-layout-1.css and css/kkbc-banner-1.css. No older .css or .js file was changed.
 * A later change of this file gets a new file name (kkbc-hero-type-2.css): the CDN keeps a file under its old name.
 * Markup (template/Home.php:183-186): <h1><span class="typingText"></span><span class="Cursor"></span></h1>.
 * The script (Home.php:480-490) writes the text as ONE text node into .typingText; footer.php:396 adds the class
 * Cursor to .typingText one second later; the cursor is the :after of .typingText.Cursor. There is no wrapper around
 * the last word, so the rule below keeps the cursor with the last word by taking it out of the line breaking.
 * No !important is used in this file.
 */

/* ---- (a) place and (c) never on a line of its own ----------------------------------------------
   Old rule: css/kkbc-layout-1.css:49-58 made the cursor an inline-block. An inline-block is a break opportunity
   before it, so at 1920 px the English heading "We deliver growth." filled the line and the cursor moved to a line of
   its own (measured 2026-10-13: kkbc.co at 1920, cursor 144 px high at the left edge under the heading).
   Now: position:absolute with left, right and top set back to auto (the old rule style.css:861 sets right:-20px and
   bottom:60px; with right:-20px the cursor would be tied to the right edge of the text, 8 px after it, and the gap
   would not follow the font size - seen in a first test). The box keeps its STATIC position, which is directly after the last
   letter on the same line, and an absolutely positioned box takes no part in line breaking. The gap is 0.08em
   (margin-inline-start, so it is right in a right-to-left page too). The containing block is .typingText
   (style.css:856, position:relative), so bottom is measured from the bottom of its last line: the content area of the
   primary font (Inter) reaches 0.2417em under the baseline, so bottom:0.2417em puts the foot of the bar on the baseline.
   Height: 0.75em Latin (a capital is 0.71em), see (b) for the other scripts. Same selector as the layout-1 rule, loaded
   later, so it wins. */
.TypingArea .TypingBox .TypingHead h1 .typingText.Cursor:after {
  position: absolute;
  display: inline-block;
  width: 0.06em;
  height: 0.75em;
  margin-inline-start: 0.08em;
  left: auto;
  right: auto;
  top: auto;
  bottom: 0.2417em;
}

/* ---- (b) height for Japanese, Chinese and Korean ----------------------------------------------
   Old rule: css/kkbc-layout-1.css:59-64 (1em high, vertical-align:-0.12em). The letters of these scripts are 0.93 to
   1.05em high and stand 0.12em under the baseline, so the bar is 1em high and its foot is 0.12em under the baseline:
   bottom = 0.2417em - 0.12em. */
:lang(ja) .TypingArea .TypingBox .TypingHead h1 .typingText.Cursor:after,
:lang(zh) .TypingArea .TypingBox .TypingHead h1 .typingText.Cursor:after,
:lang(ko) .TypingArea .TypingBox .TypingHead h1 .typingText.Cursor:after {
  height: 1em;
  bottom: 0.1217em;
}

/* ---- Japanese: the full stop leaves half an em of empty space ------------------------------------
   The Japanese full stop is a full-width glyph; its dot is in the left part and the right part is empty, so the
   picture showed 0.77em (147 px at 192 px) between the dot and the cursor (measured on kkbc.co.jp; on the other sites
   0.20em). The font feature halt (alternate half-width forms) makes the glyph half as wide; it changes only
   punctuation of this kind. The half-width box still has about 0.1em of empty space right of the dot, so the gap
   is 0.02em instead of 0.08em; that leaves 0.165em between dot and cursor, the same as a Latin or Korean full stop
   (measured on pictures at 1920 and 390). */
:lang(ja) .TypingArea .TypingBox .TypingHead h1 .typingText {
  font-feature-settings: "halt";
}
:lang(ja) .TypingArea .TypingBox .TypingHead h1 .typingText.Cursor:after {
  margin-inline-start: 0.02em;
}

/* ---- Korean: break between words, not inside a word ---------------------------------------------
   Old behaviour: the browser may break between any two syllable blocks, so at 1920 px the heading broke as
   "...이끕니 / 다." (measured kkbc.co.kr). Korean is written with spaces between words and a break inside a word is
   wrong, so a break may happen only at a space. The font size is not changed. */
:lang(ko) .TypingArea .TypingBox .TypingHead h1 .typingText {
  word-break: keep-all;
}
