/* Korean edition of Ebbline Footwear — loads after the approved base.css (unchanged) and changes only what Korean text needs.
   Latin brand type stays first in every stack (Figtree · IBM Plex Mono · Fraunces «ebbline» mark); Hangul falls through to a
   self-hosted IBM Plex Sans KR subset, renamed per the OFL Reserved Font Name rule (licence: assets/fonts/OFL.txt). */
@font-face{font-family:"Arupix Concept KO";src:url(assets/fonts/ibmplexsanskr-400.woff2?v=20261005ebblinecopyr2) format("woff2");font-weight:100 449;font-style:normal;font-display:swap}
@font-face{font-family:"Arupix Concept KO";src:url(assets/fonts/ibmplexsanskr-500.woff2?v=20261005ebblinecopyr2) format("woff2");font-weight:450 900;font-style:normal;font-display:swap}

:root{
  --sans:"Figtree","Arupix Concept KO",-apple-system,"Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono","Arupix Concept KO",ui-monospace,"SF Mono",Menlo,monospace;
}
html{font-synthesis:none}
body{word-break:keep-all;overflow-wrap:break-word;line-break:strict}

/* Tracked mono/uppercase labels: wide tracking reads as gaps between Hangul syllables. Same sizes and roles, tighter tracking;
   the 10–11px mono labels go to 12px because 11px Hangul strokes in a 400 weight blur on phones. Latin-only labels (prices,
   product names, the mark) are untouched. */
.label,.hero__eyebrow{letter-spacing:.03em}
.label{font-size:12px}
.btn-solid,.btn-ghost,.drawer__links .btn-line,.foot__form button,.foot__acc,.cat__tag{font-size:12px;letter-spacing:.03em}
.prod__badge{font-size:11px;letter-spacing:.03em}
.head__nav a{letter-spacing:.02em}
.rail__title{letter-spacing:.02em}
.drawer__nav a{letter-spacing:.02em}

/* Short actions stay on one line where they fit. */
.btn-solid,.btn-ghost,.drawer__links .btn-line,.cat__tag,.head__nav a{white-space:nowrap}

/* Hangul needs more leading than the Latin values; headings wrap at phrase boundaries, never mid-word. */
.hero__title{line-height:1.3;text-wrap:balance}
.feat__title{line-height:1.3;text-wrap:balance}
.note p{line-height:1.7}
.bar__msg{line-height:1.4}

/* Language marker in the existing header pill: current «한국어» + link to the English original. Desktop: first item of the
   right-hand group. Below 1024px the mark is centred and the right side holds two icons, so the marker sits on the empty
   left side after the burger instead of crowding the icons. */
.head__lang{display:flex;align-items:center;gap:6px;font-size:13px;line-height:1;white-space:nowrap}
.head__lang-now{font-weight:500}
.head__lang-sep{opacity:.45}
.head__lang a{position:relative;padding-bottom:2px;border-bottom:1px solid transparent;transition:border-color .18s ease}
.head__lang a:hover{border-bottom-color:var(--accent)}
.head__lang a::after{content:"";position:absolute;inset:-13px -8px}
@media (max-width:1023px){
  .head__lang{position:absolute;left:54px;top:50%;transform:translateY(-50%)}
}
@media (max-width:767px){
  .head__lang{left:50px;font-size:12px}
}
/* Below 360px the centred «ebbline» mark (~95px wide) reaches the marker's right edge; keep only the EN link there
   (the page itself is lang="ko"). */
@media (max-width:359px){
  .head__lang-now,.head__lang-sep{display:none}
}

/* Front-end demo honesty: list items with no page behind them are plain text (no href), so they must not look clickable. */
.foot a:not([href]){cursor:default}
.foot__col a:not([href]):hover,.foot__legal a:not([href]):hover{text-decoration:none}
.foot__social a:not([href]):hover{background:none;color:inherit}
.foot__hint{margin:10px 0 0;font-size:12px;line-height:1.5;opacity:.75}
.foot__concept{margin:18px 0 0;font-size:12px;line-height:1.5;opacity:.7}

/* Keyboard focus in the board's own palette. */
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.foot :focus-visible,.bar :focus-visible{outline-color:#f2f0ea}
.foot__form input:focus-visible{outline:none}
.foot__form:focus-within{border-color:#f2f0ea}
::selection{background:var(--accent);color:#fff}

/* 2026-10-05 repair batch (root LAYOUT-ASSESSMENT · qa-first): on phones the Korean photo-card titles (base 32px) and hero title
   (base 30px) are lowered to 28px/1.3 to fit Korean line length; roles, positions and alignment stay as base.css. */
@media (max-width:767px){
  .hero__title{font-size:28px;line-height:1.3}
  .feat__title{font-size:28px;line-height:1.3}
}
