/* ==========================================================================
   Language support (English / Korean)
   ========================================================================== */

/* ---- Header / offcanvas language switcher --------------------------------
   The right side of the header fades to transparent over hero images, so the
   switcher carries its own dark translucent pill to stay readable anywhere. */
.lang-switch {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border-radius: 40px;
    background: rgba(11, 14, 19, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.25);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    flex-shrink: 0;
}
.lang-switch a {
    display: inline-block;
    padding: 7px 12px;
    border-radius: 40px;
    font-family: "Inter", "Noto Sans KR", sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    color: rgba(255, 255, 255, 0.75);
    transition: background 0.3s ease, color 0.3s ease;
}
.lang-switch a:hover {
    color: #fff;
}
.lang-switch a.active {
    background: var(--theme);
    color: #fff;
}

/* Header is tightest between 1200–1399px (full nav + "get in touch" button)
   and on phones; the switcher is always available in the offcanvas menu. */
@media (min-width: 1200px) and (max-width: 1599px) {
    .header-right-icon .lang-switch {
        display: none;
    }
}
@media (max-width: 575px) {
    .header-right-icon .lang-switch {
        display: none;
    }
}

/* ---- Language popup: Korean line under the English title ---------------- */
.language-box p.language-box-ko {
    font-family: "Noto Sans KR", sans-serif;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0;
    color: var(--white);
    margin-bottom: 6px;
}
body.home-light .language-box p.language-box-ko {
    color: #14161A;
}

/* ==========================================================================
   Korean typography (html[lang="ko"])
   Poppins and Inter have no Hangul glyphs, so without this browsers fall back
   to whatever system font they have. Latin text keeps the theme fonts; Hangul
   renders in Noto Sans KR. Icon fonts (<i>, .fa-*) are left untouched.
   ========================================================================== */
html[lang="ko"] body,
html[lang="ko"] body *:not(i):not([class*="fa-"]):not(.fa):not(.fas):not(.far):not(.fab):not(.fal) {
    font-family: "Inter", "Noto Sans KR", sans-serif !important;
}
html[lang="ko"] :is(h1, h2, h3, h4, h5, h6, .theme-btn, .gt-theme-btn) {
    font-family: "Poppins", "Noto Sans KR", sans-serif !important;
}

/* Korean breaks lines between any two syllables by default, which splits
   words mid-way. keep-all wraps at spaces like English does. */
html[lang="ko"] body {
    word-break: keep-all;
    overflow-wrap: break-word;
}

/* The base h1 has letter-spacing:-3.2px and line-height:88%, tuned for
   uppercase Latin. On Hangul that overlaps syllables and clips lines. */
html[lang="ko"] h1 {
    letter-spacing: -1px;
    line-height: 115%;
}

/* Hangul glyphs are full-width and visually heavier than uppercase Latin at
   the same size, so the narrow (col-xl-4) hero headings are scaled down ~14%
   to keep the same line count as the English design. home-light.css loads
   later and keeps its own smaller mobile sizes. */
html[lang="ko"] .hero-3 .hero-content h1 { font-size: 60px; }
@media (max-width: 1600px) { html[lang="ko"] .hero-3 .hero-content h1 { font-size: 52px; } }
@media (max-width: 991px)  { html[lang="ko"] .hero-3 .hero-content h1 { font-size: 44px; } }
@media (max-width: 767px)  { html[lang="ko"] .hero-3 .hero-content h1 { font-size: 36px; } }
@media (max-width: 575px)  { html[lang="ko"] .hero-3 .hero-content h1 { font-size: 28px; } }

/* Wide tracking reads as gaps between Hangul syllables. */
html[lang="ko"] .hero-3 .hero-content h6,
html[lang="ko"] .section-title h6,
html[lang="ko"] .subtitle {
    letter-spacing: 1px;
}

/* Hangul sits better with a touch more leading in running text. */
html[lang="ko"] p {
    line-height: 1.75;
}
