/* Korean edition of Corinthian Barber Co. — loads after the approved base.css (kept byte-identical) and changes only what Korean text needs.
   Latin brand type stays first in every stack (Bricolage Grotesque · Fraunces, CORINTHIAN wordmark); Hangul falls through to a
   self-hosted IBM Plex Sans KR subset (OFL 1.1, renamed per the Reserved Font Name rule; licence in assets/fonts/OFL.txt). */
@font-face{font-family:"Arupix Concept KO";src:url(assets/fonts/ibmplexsanskr-400.woff2?v=20261005ko5v2) 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=20261005ko5v2) format("woff2");font-weight:450 900;font-style:normal;font-display:swap}
:root{
  --disp:'Bricolage Grotesque','Arupix Concept KO',system-ui,sans-serif;
  --serif:'Fraunces','Arupix Concept KO',Georgia,serif;
}
/* No faux bold/italic on Hangul: the italic Fraunces labels set Korean upright in Plex. */
html{font-synthesis:none}
body{word-break:keep-all;overflow-wrap:break-word;line-break:strict}

/* Display type. The source sizes are tuned for condensed (wdth 84) Latin capitals; full-width Hangul at the same em
   overruns the same columns, so the clamp is scaled down and the leading opened (.885 clips stacked Hangul lines).
   Roles, order and alignment are the source's; only size/leading/tracking change. */
.h-sec,.biglist a,.menu li a{font-size:clamp(28px,calc(14px + 3.6vw),66px);letter-spacing:-.01em}
.h-sec{line-height:1.12}
.loc-head .h-sec{line-height:1.12}
.biglist a{line-height:1.16}
.menu li a{line-height:1.3}
.hero-h{font-size:clamp(28px,calc(12px + 4.2vw),72px);line-height:1.22;letter-spacing:0}
.acc-bar{letter-spacing:-.01em;line-height:1.2}
.price-col h3{letter-spacing:-.01em;line-height:1.2}

/* Tracked caps spacing reads as gaps between Hangul syllables: keep the sizes, drop most of the tracking. */
.btn{letter-spacing:.02em}
.hd-book{letter-spacing:.02em}
.mq-set span{line-height:1.4}

/* Body copy: Hangul needs more leading than the 20px Latin line. */
.body-b{line-height:24px}
.story-end .body-b{line-height:25px}
.price-sub{line-height:22px}
.price-note{font-size:12px;line-height:18px}
.price-col li{line-height:24px}
.price-col li span{padding-right:12px}

/* Mobile «Est. 2014» label is CSS generated content in base.css. */
@media (max-width:700px){
  .story-mid .lab::after{content:'2014년 개업'}
}

/* Header: «한국어» marker (current) + English original, placed beside the booking action. */
.hd-end{display:flex;align-items:center;gap:22px}
.hd-lang{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:500;letter-spacing:.02em}
.hd-lang-ko{font-weight:700}
.hd-lang-sep{opacity:.5}
.hd-lang a{opacity:.75;transition:opacity .25s ease}
.hd-lang a:hover{opacity:1}
.hd-lang .l-short{display:none}
/* Menu overlay: the same language pair, the only place it shows on phones. */
.menu-lang{display:flex;gap:10px;align-items:center;margin-top:28px;font-size:15px;font-weight:500}
.menu-lang a{display:inline-flex;align-items:center;min-height:44px;opacity:.75}
.menu-lang a:hover{opacity:1}
.menu-lang span[aria-hidden]{opacity:.5}

/* Sample app button: the source linked to «#»; there is no app, so the control is disabled and says so. */
.btn-sample[disabled]{border:0;font-family:var(--disp);cursor:default}
.btn-sample[disabled]:hover{background:#fff}
.app-note{margin-top:12px;font-size:13px;line-height:20px;font-weight:500;opacity:.85}

/* Social icons are no longer links (the brand is fictional and has no accounts). */
.ft-soc-i{display:inline-flex;opacity:.9}

/* The marquee stays aria-hidden as in the source; this list carries the same eight names for screen readers. */
.mq-list{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Visible keyboard focus and selection in the board's own palette. */
:focus-visible{outline:2px solid #7b2d22;outline-offset:3px}
.dark :focus-visible,.menu :focus-visible,.hero :focus-visible,.appband :focus-visible{outline-color:var(--cream)}
::selection{background:#7b2d22;color:#fff}

@media (max-width:1100px){
  .price-note{font-size:11.5px;line-height:17px}
  .price-col li{line-height:22px}
}
@media (max-width:700px){
  .hd-end{gap:14px}
  .hd-lang-ko,.hd-lang-sep,.hd-lang .l-full{display:none}
  .hd-lang .l-short{display:inline}
  .hd-lang a{display:inline-flex;align-items:center;min-height:44px}
  .acc-col .body-b{font-size:14px;line-height:22px}
  .acc-col .addr{font-size:14px;line-height:22px}
  .price-col li{line-height:28px}
  .price-sub{font-size:13px;line-height:20px}
  .body-b{line-height:23px}
}
/* At ≤360px the header (burger · centred wordmark · booking) has no room left; the menu carries the language pair. */
@media (max-width:360px){
  .hd-lang{display:none}
}

/* 2026-10-05 한국어 여백(리듬) 수리 — 사용자 «매장·가격·커트·면도·예약, 완성된/스타일 주변 빈 공간이 지나치다».
   base.css(승인 원본)는 그대로 두고 여기서만 덮는다. 사진·글자 크기·순서·동작은 그대로. 간격은 4 단위 의미 척도(16·24·32·48·56·64·80·96·112). */
/* 소개(#about): 짧은 글을 사진 바닥으로 미는 margin-top:auto + 42px 빈 칸을 걷고 라벨·제목·단추를 가깝게(24/16). 세로 사진은 432px. */
.story{padding:112px 0 64px}
.story-fig{height:432px}
.story-txt{margin-top:24px;padding-bottom:0}
.story-txt .btn{margin-top:16px}
.story-end .body-b{margin-top:24px;padding-bottom:0}
/* 다섯 갈래 목차: 글 단을 좁히고(240–320px) 나머지는 미리보기 사진(높이 360px). 글자 크기는 그대로, 행간만 1.1. */
.nav-grid{grid-template-columns:minmax(240px,320px) minmax(0,1fr);column-gap:56px}
.biglist a{line-height:1.1}
.nav-fig{height:360px}
/* 대목 사이 간격: 매장·가격·사진 96, 서비스 이름 띠 80. 띠 위·아래 48/112. */
.locsec{padding-top:96px}
.svcsec{padding-top:96px}
.portsec{padding-top:96px}
.cutsec{padding-top:80px}
.mq{margin-top:48px;padding-bottom:112px}
/* 가격 세 단: 목록을 바닥으로 미는 margin-top:auto(약 95px 빈 칸)와 고정 최소 높이를 걷는다. 세 단은 grid 행 높이로 계속 나란하다. */
.price-col{min-height:0}
.price-col ul{margin-top:24px}
.slider{margin-top:32px}
@media (max-width:1100px){
  .price-col{min-height:0}
}
@media (max-width:700px){
  .story{padding:64px 0 40px}
  .story-fig{height:auto}
  .story-txt{margin-top:0}
  .story-txt .h-sec{margin-top:24px}
  .story-txt .btn{margin-top:16px}
  .story-end .body-b{margin-top:0}
  /* 목차: 숨은 사진 자리를 비우지 않고 3열 2행, 누름 높이 44px. 순서·링크 그대로. */
  .navsec{padding-top:16px}
  .biglist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 16px}
  .biglist a{display:flex;align-items:center;min-height:44px}
  .locsec,.svcsec,.portsec,.cutsec{padding-top:56px}
  .mq{margin-top:32px;padding-bottom:56px}
  /* 대목 머리: 제목과 단추를 한 줄로, 좁으면 자연스럽게 줄바꿈. */
  .svc-head{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
  .svc-head .btn{flex-shrink:0}
  .slider{margin-top:20px}
}