/* SNU Plastic Surgery Clinic — site.css (EN master). Composed from the rebeauty.design v18 tokens/components + EN additions at the end. */

/* =========================================================================
   SNUPS — 스누성형외과 홈페이지 리디자인 · v18 (token 260902mhk4r)
   Quiet Luxury + Medical Precision + Natural Beauty

   ★ 팔레트 출처: 브리프 §29 CSS 변수. probe.json 이 잰 현행 사이트 실측 팔레트
     (#c76029 / #2e2b29 / #c6b4a2 / #948179) 와 ΔE 가 작아 브랜드에서 벗어나지 않는다
     — 브리프 값이 실측 브랜드색의 정제판이므로 브리프 값을 그대로 쓴다.
   ★ 대비 계산은 전부 리터럴 hex 로 한다. color-mix() 금지(AA 파서가 못 읽는다).
   ========================================================================= */
:root{
  /* ---- 브리프 §29 원본 토큰 (이름·값 그대로) ---- */
  --bg-primary:#F5F0E7;      /* Warm Ivory */
  --bg-secondary:#FBF9F5;    /* Soft Cream */
  --brand-orange:#C85D2D;    /* Burnt Orange — 액센트 전용 */
  --brand-brown:#624231;     /* Saddle Brown */
  --text-primary:#251C18;    /* Espresso */
  --text-secondary:#8A817A;  /* Warm Gray */
  --border-soft:#D8CEC3;
  --max-width:1280px;

  /* ---- AA 파생 토큰 (브리프 값의 대비 한계를 메운다) ----
     --text-secondary(#8A817A) 는 아이보리 위 3.36:1 이라 **본문 크기에서 AA 미달**이다.
     그래서 원 토큰은 24px 이상 큰 글자·괘선·장식에만 쓰고,
     작은 보조 텍스트는 아래 --text-muted(5.08:1)를 쓴다.
     같은 이유로 --brand-orange 는 아이보리 위 3.66:1 — 24px 이상에서만 글자색으로 쓴다. */
  --text-muted:#6E645C;          /* on ivory 5.08:1 ✓ AA */
  --ink-on-dark:#F3EDE4;         /* on espresso 14.7:1 ✓ */
  --muted-on-dark:#B8ADA3;       /* on espresso 7.59:1 ✓ */
  --orange-on-dark:#E08A55;      /* on espresso 6.31:1 ✓ */
  --surface-dark:#251C18;
  --surface-brown:#624231;       /* 흰 글자 8.96:1 ✓ */
  --hairline:#E4DCD2;

  /* ---- GRID ---- */
  --canvas:1920px;
  --container:var(--max-width);
  --gutter:clamp(20px,4vw,64px);

  /* ---- SPACING (닫힌 스케일) ---- */
  --space-2xs:4px;  --space-xs:8px;   --space-sm:12px;  --space-md:16px;
  --space-lg:24px;  --space-xl:32px;  --space-2xl:40px; --space-3xl:56px;
  --space-4xl:72px; --space-5xl:96px; --space-6xl:120px;--space-7xl:160px;
  --section-pad:clamp(4.5rem,8vw,9.5rem);
  --grid-gap:clamp(24px,3vw,48px);
  --stack-gap:var(--space-md); --cluster-gap:var(--space-sm);
  --radius-sm:2px; --radius-md:3px; --radius-pill:999px;  /* 라운드 UI 최소화 */

  /* ---- TYPE ---- */
  --font-display:"Cormorant Garamond","Noto Serif KR",Garamond,Georgia,serif;
  --font-serif-kr:"Noto Serif KR","Cormorant Garamond",Georgia,serif;
  --font-body:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,
              system-ui,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;

  --fs-display:clamp(2.875rem,6vw,5.75rem);
  --fs-h2:clamp(2rem,3.4vw,3.25rem);
  --fs-h3:clamp(1.375rem,1.7vw,1.75rem);
  --fs-h4:clamp(1.0625rem,1.15vw,1.25rem);
  --fs-lead:clamp(1rem,1.15vw,1.1875rem);
  --fs-body:clamp(0.9375rem,1vw,1.0625rem);
  --fs-caption:clamp(0.8125rem,0.85vw,0.875rem);
  --fs-eyebrow:0.75rem;
  --fs-numeral:clamp(1.75rem,2.4vw,2.5rem);   /* 24px 이상 — 오렌지/웜그레이 허용선 */

  --lh-tight:1.06; --lh-snug:1.35; --lh-base:1.85;
  --track-display:-0.015em; --track-mid:0; --track-wide:0.18em; --track-caps:0.24em;

  /* ---- MOTION (원본이 정지 이미지라 실측 불가 → estimated) ---- */
  --dur-fast:180ms;    /* estimated */
  --dur-base:340ms;    /* estimated */
  --dur-slow:760ms;    /* estimated */
  --stagger-step:90ms; /* estimated */
  --ease-standard:cubic-bezier(.22,.61,.36,1);
  --ease-emphasis:cubic-bezier(.16,1,.3,1);
  --scroll-behavior:smooth;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:var(--scroll-behavior);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg-primary);color:var(--text-primary);
  font-family:var(--font-body);font-size:var(--fs-body);line-height:var(--lh-base);
  overflow-x:hidden;word-break:keep-all;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%} svg{max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p,figure,ul,ol,dl,dd,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.rbw2{width:100%;height:auto;display:block}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:2px solid var(--brand-orange);outline-offset:3px}
::selection{background:#E9DCCF;color:var(--text-primary)}

.skip-link{position:absolute;left:var(--space-md);top:-100px;z-index:200;
  background:var(--surface-dark);color:var(--ink-on-dark);
  padding:var(--space-sm) var(--space-lg);font-size:var(--fs-caption);
  transition:top var(--dur-fast) var(--ease-standard)}
.skip-link:focus{top:var(--space-md)}

/* ---- 레이아웃 프리미티브 ---- */
.wrap{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.sec{padding-block:var(--section-pad)}
.sec--cream{background:var(--bg-secondary)}
.sec--dark{background:var(--surface-dark);color:var(--ink-on-dark)}
.bleed{width:100%}

/* ---- 타이포 프리미티브 ---- */
.eyebrow{font-size:var(--fs-eyebrow);letter-spacing:var(--track-caps);
  text-transform:uppercase;color:var(--text-muted);font-weight:500}
.sec--dark .eyebrow{color:var(--muted-on-dark)}
.display{font-family:var(--font-display);font-weight:300;font-size:var(--fs-display);
  line-height:var(--lh-tight);letter-spacing:var(--track-display)}
.h2{font-family:var(--font-display);font-weight:300;font-size:var(--fs-h2);
  line-height:1.14;letter-spacing:var(--track-display)}
.h2-kr{font-family:var(--font-serif-kr);font-weight:300;font-size:var(--fs-h2);
  line-height:1.32;letter-spacing:-0.02em}
.h3{font-family:var(--font-serif-kr);font-weight:400;font-size:var(--fs-h3);line-height:1.4}
.h4{font-family:var(--font-serif-kr);font-weight:500;font-size:var(--fs-h4);line-height:1.5}
.lead{font-size:var(--fs-lead);line-height:1.9;color:var(--text-muted)}
.sec--dark .lead{color:var(--muted-on-dark)}
.body{font-size:var(--fs-body);line-height:var(--lh-base);color:var(--text-muted)}
.sec--dark .body{color:var(--muted-on-dark)}
.caption{font-size:var(--fs-caption);line-height:1.7;color:var(--text-muted)}
.sec--dark .caption{color:var(--muted-on-dark)}
.numeral{font-family:var(--font-display);font-weight:300;font-size:var(--fs-numeral);
  line-height:1;color:var(--brand-orange);font-feature-settings:"lnum" 1}
.rule{height:1px;background:var(--border-soft);border:0;width:100%}
.sec--dark .rule{background:#453A33}

/* ---- 액션 ---- */
.btn{display:inline-flex;align-items:center;gap:var(--space-sm);
  font-size:var(--fs-caption);letter-spacing:var(--track-wide);text-transform:uppercase;
  font-weight:500;padding:var(--space-md) var(--space-xl);border:1px solid transparent;
  transition:background var(--dur-base) var(--ease-standard),
             color var(--dur-base) var(--ease-standard),
             border-color var(--dur-base) var(--ease-standard)}
.btn--solid{background:var(--surface-dark);color:var(--ink-on-dark)}
.btn--solid:hover{background:var(--surface-brown)}
.btn--ghost{border-color:var(--text-primary);color:var(--text-primary)}
.btn--ghost:hover{background:var(--text-primary);color:var(--bg-secondary)}
.sec--dark .btn--ghost{border-color:var(--muted-on-dark);color:var(--ink-on-dark)}
.sec--dark .btn--ghost:hover{background:var(--ink-on-dark);color:var(--surface-dark)}

/* 밑줄 애니메이션 — 브리프가 허용한 4가지 인터랙션 중 하나 */
.ulink{display:inline-block;position:relative;font-size:var(--fs-caption);
  letter-spacing:var(--track-wide);text-transform:uppercase;font-weight:500;
  padding-bottom:var(--space-xs);color:var(--text-primary)}
.ulink::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;
  background:var(--brand-orange);transform:scaleX(0);transform-origin:left;
  transition:transform var(--dur-base) var(--ease-emphasis)}
.ulink:hover::after,.ulink:focus-visible::after{transform:scaleX(1)}
.sec--dark .ulink{color:var(--ink-on-dark)}
.sec--dark .ulink::after{background:var(--orange-on-dark)}

/* 이미지 스케일 호버 */
.imgbox{overflow:hidden;background:#EAE3D9;position:relative}
.imgbox img{transition:transform var(--dur-slow) var(--ease-emphasis)}
a:hover .imgbox img,.imgbox:hover img{transform:scale(1.035)}

/* ---- 페이드 리빌 ---- */
.reveal{opacity:0;transform:translateY(18px);
  transition:opacity var(--dur-slow) var(--ease-emphasis),
             transform var(--dur-slow) var(--ease-emphasis)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:var(--stagger-step)}
.reveal[data-d="2"]{transition-delay:calc(var(--stagger-step)*2)}
.reveal[data-d="3"]{transition-delay:calc(var(--stagger-step)*3)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  html{scroll-behavior:auto}
  .reveal{opacity:1!important;transform:none!important}
  .imgbox img{transform:none!important}
}

.hdr{position:sticky;top:0;z-index:60;background:transparent;
  transition:background var(--dur-base) var(--ease-standard),
             box-shadow var(--dur-base) var(--ease-standard)}
.hdr.is-stuck{background:rgba(251,249,245,.94);backdrop-filter:saturate(150%) blur(10px);
  box-shadow:0 1px 0 var(--hairline)}
.hdr__inner{width:100%;max-width:var(--container);margin-inline:auto;
  padding-inline:var(--gutter);height:88px;
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-xl)}
.brand{display:flex;align-items:center;gap:var(--space-sm)}
.brand__mark{flex:none;display:block}
.brand__text{display:flex;flex-direction:column;line-height:1}
.brand__word{font-family:var(--font-display);font-size:1.375rem;font-weight:500;
  letter-spacing:.16em;color:var(--text-primary)}
.brand__kr{font-family:var(--font-serif-kr);font-size:.6875rem;font-weight:400;
  letter-spacing:.12em;color:var(--text-muted);margin-top:var(--space-2xs)}
.nav{display:flex;gap:clamp(20px,2.2vw,40px)}
.nav a{position:relative;font-family:var(--font-display);font-size:1.0625rem;
  letter-spacing:.06em;color:var(--text-primary);padding-block:var(--space-xs)}
.nav a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;
  background:var(--brand-orange);transform:scaleX(0);transform-origin:left;
  transition:transform var(--dur-base) var(--ease-emphasis)}
.nav a:hover::after,.nav a:focus-visible::after{transform:scaleX(1)}
.hdr__act{display:flex;align-items:center;gap:var(--space-lg)}
.hdr__lang{font-size:var(--fs-caption);letter-spacing:var(--track-wide);
  color:var(--text-muted);font-weight:500}
.hdr__lang:hover{color:var(--text-primary)}
.hdr__cta{padding:var(--space-sm) var(--space-lg)}
.burger{display:none;width:40px;height:40px;align-items:center;justify-content:center}
.burger__bars{display:block;width:22px;height:1px;background:var(--text-primary);position:relative}
.burger__bars::before,.burger__bars::after{content:"";position:absolute;left:0;width:22px;
  height:1px;background:var(--text-primary)}
.burger__bars::before{top:-7px} .burger__bars::after{top:7px}

.drawer{position:fixed;inset:0;z-index:80;background:var(--bg-secondary);overflow-y:auto}
.drawer__inner{padding:var(--space-lg) var(--gutter) var(--space-5xl)}
.drawer__top{display:flex;align-items:center;justify-content:space-between;height:56px}
.drawer__x{font-size:1.25rem;line-height:1;color:var(--text-primary);padding:var(--space-sm)}
.drawer__nav{display:flex;flex-direction:column;gap:var(--space-xs);margin-top:var(--space-xl)}
.drawer__sections{display:flex;flex-direction:column;gap:0;margin-block:var(--space-md)}
.drawer__section{border-top:1px solid var(--hairline)}
.drawer__section:last-child{border-bottom:1px solid var(--hairline)}
.drawer__lead{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);
  width:100%;border:0;background:none;cursor:pointer;text-align:left;
  font-family:var(--font-display);font-size:clamp(1.375rem,5vw,2rem);font-weight:300;
  color:var(--text-primary);padding-block:var(--space-md)}
.drawer__lead::after{content:"+";font-size:1.25rem;line-height:1;color:var(--text-muted);
  transition:transform var(--dur-fast) var(--ease-standard)}
.drawer__lead[aria-expanded="true"]::after{content:"−"}
.drawer__lead em{font-family:var(--font-serif-kr);font-style:normal;font-size:.875rem;
  color:var(--text-muted)}
.drawer__panel{padding:0 var(--space-xs) var(--space-lg)}
.drawer__group{margin-bottom:var(--space-md)}
.drawer__group:last-child{margin-bottom:0}
.drawer__group .eyebrow{display:block;margin-bottom:var(--space-xs);color:var(--brand-brown)}
.drawer__group a{display:block;font-size:var(--fs-caption);color:var(--text-muted);
  padding-block:var(--space-2xs)}
.drawer__group a:hover{color:var(--text-primary)}
.drawer__cta{align-self:flex-start;margin-top:var(--space-lg)}

@media (max-width:1023px){
  .nav{display:none}
  .hdr__cta{display:none}
  .burger{display:flex}
  .hdr__inner{height:68px}
}
@media (min-width:1024px){ .drawer{display:none} }

.ftr{background:var(--surface-dark);color:var(--ink-on-dark);
  padding-block:clamp(3.5rem,6vw,6rem)}
.ftr__top{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-xl);
  flex-wrap:wrap;padding-bottom:var(--space-2xl);border-bottom:1px solid #453A33}
.ftr__brand .brand__word{color:var(--ink-on-dark)}
.ftr__brand .brand__kr{color:var(--muted-on-dark)}
.ftr__claim{font-family:var(--font-display);font-size:var(--fs-h3);font-weight:300;
  font-style:italic;color:var(--muted-on-dark)}
.ftr__map{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--space-xl);
  padding-block:var(--space-3xl)}
.ftr__col .eyebrow{display:block;color:var(--muted-on-dark);margin-bottom:var(--space-md)}
.ftr__col a{display:block;font-size:var(--fs-caption);color:var(--ink-on-dark);
  padding-block:var(--space-2xs);opacity:.86;
  transition:opacity var(--dur-base) var(--ease-standard),color var(--dur-base) var(--ease-standard)}
.ftr__col a:hover{opacity:1;color:var(--orange-on-dark)}
.ftr__langs{display:flex;flex-wrap:wrap;gap:var(--space-md) var(--space-lg);
  padding-block:var(--space-lg);border-top:1px solid #453A33;border-bottom:1px solid #453A33}
.ftr__langs a{font-size:var(--fs-caption);letter-spacing:var(--track-wide);
  color:var(--muted-on-dark)}
.ftr__langs a:hover{color:var(--ink-on-dark)}
.ftr__legal{display:flex;flex-direction:column;gap:var(--space-md);padding-top:var(--space-2xl)}
.ftr__biz{font-size:var(--fs-caption);line-height:1.9;color:var(--muted-on-dark)}
.ftr__policy{display:flex;flex-wrap:wrap;gap:var(--space-md) var(--space-lg)}
.ftr__policy a{font-size:var(--fs-caption);color:var(--ink-on-dark)}
.ftr__policy a:hover{color:var(--orange-on-dark)}
.ftr__copy{font-size:var(--fs-caption);color:var(--muted-on-dark);letter-spacing:.04em}

/* 모바일 고정 상담 CTA — 브리프 완료기준 "모바일에서 메뉴와 상담 CTA가 명확하다" */
.mcta{display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;
  align-items:center;justify-content:center;gap:var(--space-md);
  background:var(--surface-dark);color:var(--ink-on-dark);
  padding:var(--space-md) var(--space-lg);
  font-size:var(--fs-caption);letter-spacing:var(--track-wide);text-transform:uppercase;
  border-top:1px solid #453A33}
.mcta__tel{color:var(--orange-on-dark);font-variant-numeric:tabular-nums}

@media (max-width:1023px){
  .mcta{display:flex}
  .ftr__map{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-lg)}
  .ftr{padding-bottom:calc(var(--space-5xl) + var(--space-lg))}   /* 고정 상담 바 높이만큼 확보 */
}
@media (max-width:599px){
  .ftr__map{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ftr__top{flex-direction:column;gap:var(--space-md)}
}

/* =========================================================================
   서브페이지 섹션 — 홈(shell.html)의 토큰 위에만 올라간다.
   색·간격·타입스케일을 여기서 새로 정의하지 않는다(정의하면 홈과 갈라진다).
   ========================================================================= */

/* --- 브레드크럼 --- */
.crumb{border-bottom:1px solid var(--hairline);background:var(--bg-primary)}
.crumb__in{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap;
  height:52px;font-size:var(--fs-caption);color:var(--text-muted)}
.crumb__in a{color:var(--text-muted)}
.crumb__in a:hover{color:var(--text-primary)}
.crumb__sep{opacity:.5}
.crumb__cur{color:var(--text-primary)}

/* --- 서브 히어로 --- */
.shero{background:var(--bg-primary);padding-block:clamp(3rem,6vw,6.5rem) clamp(2.5rem,4vw,4rem)}
.shero__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  gap:clamp(28px,4vw,72px);align-items:end}
.shero__eyebrow{font-size:var(--fs-caption);letter-spacing:var(--track-wide);
  color:var(--brand-brown);font-weight:500}
.shero__en{font-family:var(--font-display);font-weight:300;font-size:clamp(1.5rem,2.2vw,2.25rem);
  line-height:1.1;letter-spacing:var(--track-display);color:var(--text-muted);margin-top:var(--space-md)}
.shero__h{font-family:var(--font-serif-kr);font-weight:300;
  font-size:clamp(2rem,3.6vw,3.5rem);line-height:1.28;letter-spacing:-0.025em;
  color:var(--text-primary);margin-top:var(--space-sm)}
.shero__lead{font-size:var(--fs-lead);line-height:1.9;color:var(--text-muted);
  max-width:44ch;margin-top:var(--space-lg)}
.shero__media{margin:0}
.shero__frame{aspect-ratio:4/3}
.shero__frame img{width:100%;height:100%;object-fit:cover;object-position:center 32%}

/* --- 섹션 공통 --- */
.sx{padding-block:clamp(3.5rem,6vw,7rem)}
.sx--cream{background:var(--bg-secondary)}
.sx__head{display:flex;flex-direction:column;gap:var(--space-md);max-width:62ch}
.sx__no{font-family:var(--font-display);font-size:var(--fs-caption);letter-spacing:var(--track-wide);
  color:var(--brand-brown);font-weight:500}   /* 작은 라벨에 오렌지 금지 — AA 3.66:1 */
.sx__h{font-family:var(--font-serif-kr);font-weight:400;
  font-size:clamp(1.5rem,2.5vw,2.25rem);line-height:1.36;letter-spacing:-0.02em;color:var(--text-primary)}
.sx__intro{font-size:var(--fs-body);line-height:var(--lh-base);color:var(--text-muted);max-width:56ch}
.sx__body{margin-top:clamp(1.75rem,3vw,2.75rem)}

/* --- prose --- */
.pr{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,72px);
  align-items:start}
.pr--wide{grid-template-columns:minmax(0,1fr)}
.pr__text p{font-size:var(--fs-lead);line-height:1.95;color:var(--text-muted);max-width:54ch}
.pr__text p + p{margin-top:var(--space-lg)}
.pr__media{display:grid;gap:var(--space-md)}
.pr__media .imgbox{aspect-ratio:4/5}
.pr__media--two .imgbox{aspect-ratio:1/1}
.pr__media img{width:100%;height:100%;object-fit:cover}

/* --- cases (번호 원형 그리드) --- */
.cs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--grid-gap)}
.cs__i{border-top:1px solid var(--border-soft);padding-top:var(--space-lg)}
.cs__n{font-family:var(--font-display);font-size:var(--fs-numeral);line-height:1;
  color:var(--brand-orange);font-weight:300}
.cs__t{font-family:var(--font-serif-kr);font-size:var(--fs-h4);color:var(--text-primary);
  margin-top:var(--space-md)}
.cs__b{font-size:var(--fs-body);line-height:1.85;color:var(--text-muted);margin-top:var(--space-sm);
  white-space:pre-line}

/* --- points (세로 번호 목록) --- */
.pt{display:flex;flex-direction:column}
.pt__i{display:flex;gap:clamp(20px,3vw,52px);align-items:flex-start;
  padding-block:clamp(20px,2.4vw,34px);border-top:1px solid var(--border-soft)}
.pt__i:last-child{border-bottom:1px solid var(--border-soft)}
.pt__n{flex:none;font-family:var(--font-display);font-size:var(--fs-caption);
  letter-spacing:var(--track-wide);color:var(--brand-brown);font-weight:500;padding-top:.45em;
  min-width:5.5em}
.pt__c{flex:1}
.pt__t{font-family:var(--font-serif-kr);font-size:var(--fs-h4);color:var(--text-primary)}
.pt__b{font-size:var(--fs-lead);line-height:1.9;color:var(--text-muted);white-space:pre-line}
.pt__t + .pt__b{margin-top:var(--space-xs)}

/* --- steps --- */
.st{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:var(--grid-gap)}
.st__i{border-top:1px solid var(--border-soft);padding-top:var(--space-lg)}
.st__n{font-family:var(--font-display);font-size:var(--fs-caption);letter-spacing:var(--track-wide);
  color:var(--brand-brown);font-weight:500}
.st__t{font-family:var(--font-serif-kr);font-size:var(--fs-h4);color:var(--text-primary);
  margin-top:var(--space-sm)}
.st__b{font-size:var(--fs-body);line-height:1.85;color:var(--text-muted);margin-top:var(--space-xs);
  white-space:pre-line}

/* --- cards (이미지 + 제목 + 본문) --- */
.cd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(32px,4vw,64px) var(--grid-gap)}
.cd--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cd__f{aspect-ratio:4/3}
.cd__f img{width:100%;height:100%;object-fit:cover}
.cd__n{font-family:var(--font-display);font-size:var(--fs-caption);letter-spacing:var(--track-wide);
  color:var(--brand-brown);font-weight:500;margin-top:var(--space-lg)}
.cd__t{font-family:var(--font-serif-kr);font-size:var(--fs-h4);color:var(--text-primary);
  margin-top:var(--space-2xs)}
.cd__b{font-size:var(--fs-body);line-height:1.85;color:var(--text-muted);margin-top:var(--space-sm);
  white-space:pre-line}

/* --- table --- */
.tb{width:100%;border-collapse:collapse;font-size:var(--fs-body)}
.tb th,.tb td{padding:var(--space-md) var(--space-lg);text-align:left;
  border-bottom:1px solid var(--border-soft);vertical-align:top;line-height:1.75}
.tb thead th{font-family:var(--font-serif-kr);font-weight:500;color:var(--text-primary);
  border-bottom:1px solid var(--text-primary);white-space:nowrap}
.tb tbody th,.tb td:first-child{color:var(--text-primary);font-weight:500;white-space:nowrap}
.tb td{color:var(--text-muted)}
.tb td:last-child{color:var(--text-primary)}
.tb__wrap{overflow-x:auto}

/* --- gallery --- */
.gl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,44px)}
.gl--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.gl--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.gl__f{aspect-ratio:3/4}
.gl--wide .gl__f{aspect-ratio:4/3}   /* 가로 단계 그림(눈밑지방재배치 수술 단계) */
.gl__f img{width:100%;height:100%;object-fit:cover}
.gl__t{font-family:var(--font-serif-kr);font-size:var(--fs-h4);color:var(--text-primary);
  margin-top:var(--space-md);white-space:pre-line}
.gl__b{font-size:var(--fs-caption);line-height:1.8;color:var(--text-muted);margin-top:var(--space-2xs);
  white-space:pre-line}

/* --- policy (약관) --- */
.pl{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,4vw,72px);
  align-items:start}
.pl__toc{position:sticky;top:112px;display:flex;flex-direction:column;gap:var(--space-xs)}
.pl__toc a{font-size:var(--fs-caption);color:var(--text-muted);padding-block:var(--space-2xs);
  border-left:1px solid var(--border-soft);padding-left:var(--space-md)}
.pl__toc a:hover{color:var(--text-primary);border-color:var(--brand-orange)}
.pl__art + .pl__art{margin-top:clamp(2rem,3vw,3rem);padding-top:clamp(2rem,3vw,3rem);
  border-top:1px solid var(--border-soft)}
.pl__h{font-family:var(--font-serif-kr);font-size:var(--fs-h4);color:var(--text-primary);
  scroll-margin-top:120px}
.pl__t{font-size:var(--fs-body);line-height:2.05;color:var(--text-muted);margin-top:var(--space-md);
  white-space:pre-line}
.pl__lead{font-size:var(--fs-lead);line-height:1.95;color:var(--text-muted);white-space:pre-line;
  max-width:62ch}

/* --- fees (비급여 수가) --- */
.fe + .fe{margin-top:clamp(2.5rem,4vw,4rem)}
.fe__h{font-family:var(--font-serif-kr);font-size:var(--fs-h4);color:var(--text-primary);
  padding-bottom:var(--space-md);border-bottom:1px solid var(--text-primary)}
.fe .tb{margin-top:0}
.fe .tb td:last-child{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}

/* --- board (게시판) --- */
.bd{display:flex;flex-direction:column}
.bd__i{border-top:1px solid var(--border-soft)}
.bd__i:last-child{border-bottom:1px solid var(--border-soft)}
.bd__i a{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-lg);
  padding-block:clamp(20px,2.2vw,30px);flex-wrap:wrap}
.bd__t{font-family:var(--font-serif-kr);font-size:var(--fs-h4);color:var(--text-primary);flex:1}
.bd__i a:hover .bd__t{color:var(--brand-brown)}
.bd__d{font-size:var(--fs-caption);color:var(--text-muted);font-variant-numeric:tabular-nums}
.bd__empty{padding-block:clamp(3rem,6vw,6rem);text-align:center;border-top:1px solid var(--border-soft);
  border-bottom:1px solid var(--border-soft)}
.bd__empty p{font-size:var(--fs-lead);color:var(--text-muted)}

/* --- 관련 시술 --- */
.rel{border-top:1px solid var(--border-soft);padding-block:clamp(3rem,5vw,5rem)}
.rel__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:var(--space-lg) var(--grid-gap);margin-top:var(--space-xl)}
.rel__i{display:block;padding-block:var(--space-sm);border-top:1px solid var(--hairline)}
.rel__k{font-family:var(--font-serif-kr);font-size:var(--fs-body);color:var(--text-primary)}
.rel__e{display:block;font-family:var(--font-display);font-size:var(--fs-caption);
  color:var(--text-muted);margin-top:var(--space-2xs)}
.rel__i:hover .rel__k{color:var(--brand-brown)}

/* --- 페이지 하단 상담 --- */
.pcta{background:var(--surface-dark);color:var(--ink-on-dark);
  padding-block:clamp(3rem,5vw,5.5rem)}
.pcta__in{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2xl);
  flex-wrap:wrap}
.pcta__h{font-family:var(--font-display);font-weight:300;font-size:clamp(1.75rem,2.8vw,2.5rem);
  line-height:1.15;color:var(--ink-on-dark)}
.pcta__s{font-size:var(--fs-body);color:var(--muted-on-dark);margin-top:var(--space-sm);max-width:46ch}
.pcta__act{display:flex;gap:var(--space-md);flex-wrap:wrap}
.pcta .btn--ghost{border-color:var(--muted-on-dark);color:var(--ink-on-dark)}
.pcta .btn--ghost:hover{background:var(--ink-on-dark);color:var(--surface-dark)}

/* --- 의료광고 고지 --- */
.disc{padding-block:var(--space-2xl);background:var(--bg-primary)}
.disc p{font-size:var(--fs-caption);line-height:1.85;color:var(--text-muted);max-width:78ch}

/* --- 출처 메모(v18 전사 페이지) --- */
.srcnote{margin-top:var(--space-lg);padding:var(--space-lg);border:1px solid var(--border-soft);
  background:var(--bg-secondary)}
.srcnote p{font-size:var(--fs-caption);line-height:1.8;color:var(--text-muted);margin:0}

@media (max-width:1023px){
  .cs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cd--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gl--4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:899px){
  .shero__grid,.pr,.pl{grid-template-columns:minmax(0,1fr);align-items:start}
  .pl__toc{position:static;flex-direction:row;flex-wrap:wrap;gap:var(--space-sm)}
  .pl__toc a{border-left:0;border-bottom:1px solid var(--border-soft);padding-left:0;
    padding-bottom:var(--space-2xs)}
  .gl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pt__i{flex-direction:column;gap:var(--space-xs)}
  .pt__n{padding-top:0}
}
@media (max-width:599px){
  .cs,.cd,.cd--4,.gl,.gl--2,.gl--4{grid-template-columns:minmax(0,1fr)}
}

/* prose 뒤 전폭 이미지 그리드 */
.pr__after{margin-top:clamp(2rem,3vw,3rem)}
.pr__after .gl__f{aspect-ratio:4/3}

/* =========================================================================
   HOME sections (from index v18)
   ========================================================================= */
/* --- sec_02 --- */
.hero{padding-top:clamp(2rem,4vw,4.5rem);padding-bottom:clamp(3rem,5vw,6rem);
  background:var(--bg-primary)}
.hero__type{display:flex;flex-direction:column;align-items:flex-start;
  gap:var(--space-lg);padding-bottom:clamp(2.5rem,5vw,5rem)}
.hero__h{margin-top:var(--space-md);max-width:14ch}
.hero__kr{color:var(--text-primary);font-weight:200}
.hero__lead{max-width:46ch;margin-top:calc(var(--space-2xs)*-1)}
.hero__act{display:flex;align-items:center;gap:var(--space-2xl);flex-wrap:wrap;
  margin-top:var(--space-md)}
.hero__media{margin:0}
.hero__frame{width:100vw;margin-left:calc(50% - 50vw);aspect-ratio:1920/609;max-height:64vh}
.hero__frame img{width:100%;height:100%;object-fit:cover;object-position:64% center}
.hero__cap{display:flex;justify-content:space-between;gap:var(--space-lg);flex-wrap:wrap;
  margin-top:var(--space-md);font-size:var(--fs-caption);letter-spacing:.06em;
  color:var(--text-muted)}

@media (max-width:899px){
  .hero__frame{aspect-ratio:4/3;max-height:none}
  .hero__frame img{object-position:72% center}
}
@media (max-width:599px){
  .hero__h{max-width:100%}
  .hero__act{gap:var(--space-lg)}
}
/* --- sec_03 --- */
.phil{padding-bottom:0}
.phil__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:var(--grid-gap);align-items:start}
.phil__h{margin-top:var(--space-lg)}
.phil__h em{font-style:italic;color:var(--brand-brown)}
.phil__body{display:flex;flex-direction:column;gap:var(--space-lg);align-items:flex-start;
  padding-top:var(--space-sm)}
.phil__kr{color:var(--text-primary);font-weight:200}
.phil__body .lead{max-width:52ch}
.phil__body .body{max-width:52ch}
.phil__media{margin:clamp(3.5rem,6vw,6.5rem) 0 0}
.phil__frame{width:100vw;margin-left:calc(50% - 50vw);aspect-ratio:1200/680;max-height:70vh}
.phil__frame img{width:100%;height:100%;object-fit:cover}
.phil__cap{display:block;margin-top:var(--space-md);padding-bottom:var(--section-pad);
  font-size:var(--fs-caption);color:var(--text-muted)}
@media (max-width:899px){
  .phil__grid{grid-template-columns:minmax(0,1fr);gap:var(--space-xl)}
  .phil__frame{aspect-ratio:3/2}
}
/* --- sec_04 --- */
.proc__head{max-width:60ch;display:flex;flex-direction:column;gap:var(--space-lg)}
.proc__sub{max-width:52ch}
.proc__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(32px,4vw,72px) var(--grid-gap);margin-top:clamp(3rem,5vw,5.5rem)}
.proc__frame{aspect-ratio:3/2}
.proc__frame img{width:100%;height:100%;object-fit:cover;object-position:center 32%}
.proc__meta{display:flex;gap:var(--space-lg);align-items:flex-start;
  padding-top:var(--space-lg);border-top:1px solid var(--border-soft);
  margin-top:var(--space-lg)}
.proc__no{flex:none;padding-top:var(--space-2xs)}
.proc__en{color:var(--text-primary);font-family:var(--font-display);font-weight:400;
  letter-spacing:.01em}
.proc__kr{font-family:var(--font-serif-kr);font-size:var(--fs-body);
  color:var(--brand-brown);margin-top:var(--space-2xs)}
.proc__list{margin-top:var(--space-sm)}
.proc__item a{display:block}
.proc__item a:hover .proc__en{color:var(--brand-brown)}
.proc__more{margin-top:clamp(3rem,5vw,5rem)}
@media (max-width:767px){
  .proc__grid{grid-template-columns:minmax(0,1fr)}
}
/* --- sec_05 --- */
.doc__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(32px,5vw,88px);align-items:start}
.doc__portrait{margin:0}
.doc__frame{aspect-ratio:508/647;background:#3A2F28}
.doc__frame img{width:100%;height:100%;object-fit:cover}
.doc__sign{margin-top:var(--space-md);letter-spacing:.08em;font-family:var(--font-display);
  font-size:1rem}
.doc__body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-lg)}
.doc__h{margin-top:var(--space-md);color:var(--ink-on-dark);font-weight:300}
.doc__kr{font-family:var(--font-serif-kr);font-size:var(--fs-h3);color:var(--ink-on-dark);
  font-weight:400}
.doc__kr span{font-size:var(--fs-body);color:var(--muted-on-dark);margin-left:var(--space-sm)}
.doc__cred{display:flex;flex-direction:column;width:100%;margin-top:var(--space-sm)}
.doc__cred li{display:flex;gap:var(--space-lg);align-items:baseline;
  padding-block:var(--space-md);border-top:1px solid #453A33;
  font-size:var(--fs-body);color:var(--ink-on-dark)}
.doc__cred li:last-child{border-bottom:1px solid #453A33}
.doc__cno{flex:none;font-family:var(--font-display);font-size:.9375rem;letter-spacing:.1em;
  color:var(--orange-on-dark)}
.doc__quote{display:flex;flex-direction:column;gap:var(--space-md);margin-top:var(--space-sm)}
.doc__quote .h2-kr{color:var(--ink-on-dark);font-weight:200}
.doc__quote .body{max-width:50ch}
.doc__strip{margin-top:clamp(3.5rem,6vw,7rem)}
.doc__wide{aspect-ratio:2/1}
.doc__wide img{width:100%;height:100%;object-fit:cover;object-position:center 38%}
.doc__wcap{margin-top:var(--space-md)}
@media (max-width:899px){
  .doc__grid{grid-template-columns:minmax(0,1fr);gap:var(--space-2xl)}
  .doc__frame{aspect-ratio:4/5}
  .doc__wide{aspect-ratio:3/2}
}
/* --- sec_06 --- */
.why__head{display:flex;flex-direction:column;gap:var(--space-lg)}
.why__list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--grid-gap);margin-top:clamp(3rem,5vw,5.5rem)}
.why__item{border-top:1px solid var(--border-soft);padding-top:var(--space-xl)}
.why__no{display:block;font-style:italic;letter-spacing:.06em}
.why__en{font-family:var(--font-display);font-size:var(--fs-h3);font-weight:400;
  color:var(--text-primary);margin-top:var(--space-lg);letter-spacing:.02em}
.why__kr{font-family:var(--font-serif-kr);font-size:var(--fs-caption);
  color:var(--brand-brown);letter-spacing:.12em;margin-top:var(--space-2xs)}
.why__txt{margin-top:var(--space-md);max-width:38ch}
@media (max-width:899px){ .why__list{grid-template-columns:minmax(0,1fr);gap:var(--space-xl)} }
/* --- sec_07 --- */
.feat__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  gap:clamp(32px,5vw,80px);align-items:center}
.feat__media{margin:0}
.feat__frame{aspect-ratio:920/440}
.feat__frame img{width:100%;height:100%;object-fit:cover;object-position:22% center}
.feat__body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-lg)}
.feat__h{margin-top:var(--space-sm)}
.feat__kr{font-size:var(--fs-h3);color:var(--brand-brown);font-weight:400}
.feat__lead{max-width:34ch}
.feat__txt{max-width:42ch}
@media (max-width:899px){
  .feat__grid{grid-template-columns:minmax(0,1fr)}
  .feat__frame{aspect-ratio:3/2}
}
/* --- sec_08 --- */
.ba__head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:var(--grid-gap);align-items:end}
.ba__head .h2{margin-top:var(--space-lg)}
.ba__sub{max-width:44ch}
.ba__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--grid-gap);margin-top:clamp(3rem,5vw,5rem)}
.ba__plate{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));aspect-ratio:4/3;
  border:1px solid var(--border-soft);background:var(--bg-primary);
  transition:border-color var(--dur-base) var(--ease-standard)}
.ba__item a:hover .ba__plate{border-color:var(--brand-orange)}
.ba__half{display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:1.0625rem;letter-spacing:var(--track-wide);
  text-transform:uppercase;color:var(--text-muted)}
.ba__half + .ba__half{border-left:1px solid var(--border-soft)}
.ba__meta{display:flex;gap:var(--space-lg);align-items:flex-start;margin-top:var(--space-lg)}
.ba__meta .h4{color:var(--text-primary)}
.ba__meta .caption{margin-top:var(--space-2xs)}
.ba__foot{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-xl);
  flex-wrap:wrap;margin-top:clamp(2.5rem,4vw,4rem);padding-top:var(--space-lg);
  border-top:1px solid var(--border-soft)}
.ba__disc{max-width:56ch}
@media (max-width:899px){
  .ba__head{grid-template-columns:minmax(0,1fr);align-items:start}
  .ba__grid{grid-template-columns:minmax(0,1fr);gap:var(--space-2xl)}
}
/* --- sec_09 --- */
.tech__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(32px,5vw,88px);align-items:start}
.tech__head{display:flex;flex-direction:column;gap:var(--space-lg)}
.tech__txt{max-width:38ch}
.tech__frame{aspect-ratio:4/5;margin-top:var(--space-md)}
.tech__frame img{width:100%;height:100%;object-fit:cover;object-position:64% center}
.tech__list{display:flex;flex-direction:column;padding-top:var(--space-2xl)}
.tech__row{display:flex;gap:clamp(20px,2.5vw,44px);align-items:flex-start;
  padding-block:clamp(24px,2.6vw,40px);border-top:1px solid var(--border-soft)}
.tech__row:last-child{border-bottom:1px solid var(--border-soft)}
.tech__no{flex:none;padding-top:var(--space-2xs)}
.tech__en{font-family:var(--font-display);font-size:var(--fs-h3);font-weight:400;
  color:var(--text-primary);letter-spacing:.01em}
.tech__kr{font-family:var(--font-serif-kr);font-size:var(--fs-body);color:var(--brand-brown);
  margin-top:var(--space-2xs)}
.tech__info .caption{margin-top:var(--space-sm);max-width:44ch}
.tech__foot{display:flex;justify-content:space-between;align-items:baseline;
  gap:var(--space-xl);flex-wrap:wrap;margin-top:clamp(2.5rem,4vw,4rem)}
@media (max-width:899px){
  .tech__grid{grid-template-columns:minmax(0,1fr);gap:var(--space-2xl)}
  .tech__frame{aspect-ratio:3/2}
  .tech__list{padding-top:0}
}
/* --- sec_10 --- */
.intl__grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);
  gap:clamp(32px,5vw,88px);align-items:start}
.intl__body{display:flex;flex-direction:column;gap:var(--space-lg)}
.intl__h{color:var(--ink-on-dark)}
.intl__lead{max-width:44ch}
.intl__langs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-xs) var(--space-lg);margin-top:var(--space-sm)}
.intl__langs a{display:block;padding-block:var(--space-xs);font-size:var(--fs-body);
  color:var(--ink-on-dark);border-bottom:1px solid #453A33;
  transition:color var(--dur-base) var(--ease-standard),
             border-color var(--dur-base) var(--ease-standard)}
.intl__langs a:hover{color:var(--orange-on-dark);border-color:var(--orange-on-dark)}
.intl__ch{margin-top:var(--space-xl)}
.intl__chlist{display:flex;flex-wrap:wrap;gap:var(--space-lg) var(--space-2xl);
  margin-top:var(--space-md)}
.intl__media{margin:0}
.intl__frame{aspect-ratio:4/5}
.intl__frame img{width:100%;height:100%;object-fit:cover;object-position:52% center}
.intl__cap{margin-top:var(--space-md)}
@media (max-width:899px){
  .intl__grid{grid-template-columns:minmax(0,1fr);gap:var(--space-2xl)}
  .intl__frame{aspect-ratio:3/2}
}
@media (max-width:479px){ .intl__langs{grid-template-columns:minmax(0,1fr)} }
/* --- sec_11 --- */
.jr__head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:var(--grid-gap);align-items:end}
.jr__head .h2{margin-top:var(--space-lg)}
.jr__sub{max-width:34ch}
.jr__list{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  gap:0 clamp(32px,5vw,80px);margin-top:clamp(3rem,5vw,5rem)}
.jr__item--lead{grid-row:span 3;border-top:1px solid var(--border-soft);
  padding-top:var(--space-xl)}
.jr__item--lead .jr__t{margin-top:var(--space-md);color:var(--text-primary);font-weight:300}
.jr__x{margin-top:var(--space-lg);max-width:40ch}
.jr__go{margin-top:var(--space-xl)}
.jr__item:not(.jr__item--lead){border-top:1px solid var(--border-soft);
  padding-block:clamp(20px,2.2vw,32px)}
.jr__item:not(.jr__item--lead):last-child{border-bottom:1px solid var(--border-soft)}
.jr__meta{display:flex;align-items:center;gap:var(--space-md);
  font-size:var(--fs-caption);color:var(--text-muted);letter-spacing:.06em}
.jr__tag{font-family:var(--font-display);letter-spacing:var(--track-wide);
  text-transform:uppercase;color:var(--brand-brown)}
.jr__t2{margin-top:var(--space-xs);color:var(--text-primary);font-weight:400}
.jr__item a{display:block}
.jr__item a:hover .jr__t,.jr__item a:hover .jr__t2{color:var(--brand-brown)}
.jr__foot{display:flex;flex-wrap:wrap;gap:var(--space-lg) var(--space-3xl);
  margin-top:clamp(2.5rem,4vw,4rem);padding-top:var(--space-lg);
  border-top:1px solid var(--border-soft)}
@media (max-width:899px){
  .jr__head{grid-template-columns:minmax(0,1fr);align-items:start}
  .jr__list{grid-template-columns:minmax(0,1fr)}
  .jr__item--lead{grid-row:auto;padding-bottom:var(--space-xl)}
}
/* --- sec_12 --- */
.cta{padding-top:0}
.cta__media{margin:0 0 clamp(3rem,5vw,6rem)}
.cta__frame{width:100vw;margin-left:calc(50% - 50vw);aspect-ratio:1200/680;max-height:56vh}
.cta__frame img{width:100%;height:100%;object-fit:cover;object-position:center 46%}
.cta__head{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-lg);
  max-width:56ch}
.cta__sub{max-width:44ch}
.cta__act{display:flex;flex-wrap:wrap;gap:var(--space-md);margin-top:var(--space-sm)}
.cta__info{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--grid-gap);
  margin-top:clamp(3rem,5vw,5.5rem)}
.cta__block{border-top:1px solid var(--border-soft);padding-top:var(--space-lg)}
.cta__block dd{display:flex;flex-direction:column;gap:var(--space-xs);margin-top:var(--space-md)}
.cta__row{display:flex;align-items:baseline;gap:var(--space-md);font-size:var(--fs-body)}
.cta__row span{flex:none;width:4.5em;color:var(--text-muted);font-size:var(--fs-caption)}
.cta__row b{font-weight:500;color:var(--text-primary);font-variant-numeric:tabular-nums}
.cta__addr{font-family:var(--font-serif-kr);font-size:var(--fs-h4);line-height:1.55;
  color:var(--text-primary)}
.cta__note{margin-top:var(--space-xs)}
.cta__note a{border-bottom:1px solid var(--border-soft)}
.cta__map{margin-top:var(--space-md)}
@media (max-width:899px){
  .cta__info{grid-template-columns:minmax(0,1fr);gap:var(--space-xl)}
  .cta__frame{aspect-ratio:3/2}
}

/* =========================================================================
   EN master additions — brand lock-up, flyout navigation, split hero,
   language switcher, and components used by the new pages.
   Built on the v18 tokens above; no new colours or type sizes.
   ========================================================================= */

/* ---- brand ---- */
.brand__logo{display:block;height:44px;width:auto}
.ftr__brand{display:flex;flex-direction:column;gap:var(--space-md);max-width:44ch}
.ftr__logo{display:block;height:38px;width:auto}
.ftr__desc{font-size:var(--fs-caption);line-height:1.8;color:var(--muted-on-dark)}

/* ---- navigation: full-width menu boards with per-item descriptions ---- */
.hdr__inner{max-width:1440px}                 /* header may run wider than the content column */
.brand{flex:none}
.brand__logo{display:block;height:44px;width:auto;max-width:none;flex:none}
.hdr__act{flex:none}
.nav{display:flex;align-self:stretch;min-width:0}
.nav__list{display:flex;align-items:stretch;gap:clamp(12px,1.4vw,26px);margin:0;padding:0;list-style:none;height:100%}
.nav__item{position:static;display:flex;align-items:center}
.nav .nav__link{position:relative;display:inline-block;font-family:var(--font-display);font-size:1rem;
  letter-spacing:.06em;color:var(--text-primary);padding-block:var(--space-xs);white-space:nowrap}
.nav .nav__link::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;
  background:var(--brand-orange);transform:scaleX(0);transform-origin:left;
  transition:transform var(--dur-base) var(--ease-emphasis)}
.nav__item:hover>.nav__link::after,.nav .nav__link:focus-visible::after,
.nav__item.is-open>.nav__link::after,.nav .nav__link[aria-current="page"]::after{transform:scaleX(1)}

.mega{position:absolute;left:0;right:0;top:100%;z-index:70;opacity:0;visibility:hidden;transform:translateY(4px);
  background:var(--bg-secondary);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);
  box-shadow:0 28px 48px rgba(37,28,24,.10);
  transition:opacity var(--dur-fast) var(--ease-standard),transform var(--dur-fast) var(--ease-standard),
             visibility 0s linear var(--dur-fast)}
.nav__item:hover>.mega,.nav__item:focus-within>.mega,.nav__item.is-open>.mega{
  opacity:1;visibility:visible;transform:none;transition-delay:0s}
.mega__in{width:100%;max-width:var(--container);margin-inline:auto;
  padding:var(--space-2xl) var(--gutter) var(--space-3xl);
  display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:clamp(28px,4vw,72px)}
.mega__intro{display:flex;flex-direction:column;gap:var(--space-md);align-items:flex-start;
  padding-right:var(--space-xl);border-right:1px solid var(--hairline)}
.mega__h{font-family:var(--font-display);font-weight:300;font-size:var(--fs-h2);line-height:1.1;
  letter-spacing:var(--track-display);color:var(--text-primary)}
.mega__lead{font-size:var(--fs-caption);line-height:1.8;color:var(--text-muted);max-width:26ch}
.mega__intro .ulink{margin-top:var(--space-xs)}
.mega__cols{display:grid;grid-template-columns:repeat(var(--n,1),minmax(0,1fr));gap:var(--space-2xl)}
.mega__col .eyebrow{display:block;margin-bottom:var(--space-xs);color:var(--brand-brown);white-space:nowrap}
.nav .mega__item{display:block;position:static;padding:10px 0;border-top:1px solid var(--hairline);
  font-family:var(--font-body);font-size:var(--fs-body);letter-spacing:0;white-space:normal}
.nav .mega__item:last-child{border-bottom:1px solid var(--hairline)}
.nav .mega__item::after{content:none}
.mega__t{display:block;font-family:var(--font-display);font-size:1.0625rem;font-weight:500;line-height:1.3;
  color:var(--text-primary);transition:color var(--dur-fast) var(--ease-standard)}
.mega__d{display:block;font-size:.8125rem;line-height:1.6;color:var(--text-muted);margin-top:3px}
.nav .mega__item:hover .mega__t,.nav .mega__item:focus-visible .mega__t{color:var(--brand-orange)}

@media (max-width:1439px){                     /* keep the whole header on one line down to 1280px */
  .nav .nav__link{font-size:.9375rem;letter-spacing:.04em}
  .nav__list{gap:14px}
  .hdr__inner{gap:var(--space-lg)}
  .hdr__act{gap:var(--space-md)}
  .brand__logo{height:40px}
  .hdr__cta{padding-inline:var(--space-md)}
  .hdr__langs li+li::before{margin-inline:7px}
}

/* ---- language switcher ---- */
.hdr__langs{display:flex;align-items:center;margin:0;padding:0;list-style:none}
.hdr__langs li{display:flex;align-items:center}
.hdr__langs li+li::before{content:"";width:1px;height:10px;background:var(--border-soft);margin-inline:10px}
.hdr__langs a{font-size:var(--fs-caption);letter-spacing:.06em;color:var(--text-muted);font-weight:500;white-space:nowrap}
.hdr__langs a:hover,.hdr__langs a.is-active{color:var(--text-primary)}
.hdr__cta{white-space:nowrap}
.drawer__langs{display:flex;flex-wrap:wrap;gap:var(--space-md) var(--space-lg);padding-block:var(--space-lg);
  border-top:1px solid var(--border-soft)}
.drawer__langs a{font-size:var(--fs-caption);letter-spacing:.06em;color:var(--text-muted)}
.drawer__langs a[aria-current]{color:var(--text-primary)}
.drawer__cols{grid-template-columns:repeat(3,minmax(0,1fr))}

/* desktop navigation needs the full container width — burger below 1280px */
@media (max-width:1279px){
  .nav{display:none}
  .hdr__cta{display:none}
  .burger{display:flex}
  .hdr__inner{height:72px}
  .brand__logo{height:38px}
  .drawer:not([hidden]){display:block}
}
@media (min-width:1280px){ .drawer{display:none} }
@media (max-width:767px){ .drawer__cols{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:599px){
  .brand__logo{height:32px}
  .hdr__langs{display:none}
  .drawer__cols{grid-template-columns:minmax(0,1fr)}
}

/* ---- split hero (text left, facial-detail image bleeding right) ---- */
.hero--split{padding:0;background:var(--bg-primary);border-bottom:1px solid var(--hairline)}
.hero__split{display:grid;grid-template-columns:minmax(0,42fr) minmax(0,58fr);min-height:min(76vh,720px)}
.hero__copy{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--space-lg);
  padding:clamp(3rem,6vw,6rem) clamp(24px,4vw,64px) clamp(3rem,6vw,6rem)
          max(var(--gutter),calc((100vw - var(--container)) / 2 + var(--gutter)))}
.hero__copy .display{max-width:11ch}
.hero__rule{width:56px;height:1px;background:var(--brand-orange);margin-block:var(--space-2xs)}
.hero__copy .hero__lead{max-width:38ch}
.hero__imgwrap{position:relative;min-height:420px}
.hero__imgwrap .imgbox{position:absolute;inset:0}
.hero__imgwrap img{width:100%;height:100%;object-fit:cover;object-position:72% 45%}
.hero__idx{position:absolute;right:var(--gutter);bottom:var(--space-xl);display:flex;align-items:center;gap:var(--space-md);
  font-family:var(--font-display);font-size:var(--fs-caption);letter-spacing:.12em;color:var(--bg-secondary)}
.hero__idx::before{content:"";width:48px;height:1px;background:var(--bg-secondary);opacity:.7}
@media (max-width:899px){
  .hero__split{grid-template-columns:minmax(0,1fr);min-height:0}
  .hero__copy{padding:clamp(2.5rem,6vw,4rem) var(--gutter)}
  .hero__imgwrap{min-height:0;aspect-ratio:4/3}
  .hero__imgwrap .imgbox{position:absolute}
}

/* ---- home: doctor section credential list wraps long English lines ---- */
.doc__cred li{line-height:1.6}
.doc__kr span{display:inline-block}

/* ---- sub hero: lead paragraph + Korean cross-reference ---- */
.shero__ko{display:block;font-family:var(--font-serif-kr);font-size:var(--fs-caption);letter-spacing:.06em;
  color:var(--text-muted);margin-top:var(--space-sm)}
.shero__h{font-family:var(--font-display);font-weight:300;letter-spacing:var(--track-display);line-height:1.08}

/* ---- contact channels (International, Hours) ---- */
.ch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--grid-gap)}
.ch__i{border-top:1px solid var(--border-soft);padding-top:var(--space-lg)}
.ch__t{font-family:var(--font-display);font-size:var(--fs-h3);font-weight:400;color:var(--text-primary)}
.ch__b{font-size:var(--fs-body);line-height:1.8;color:var(--text-muted);margin-top:var(--space-xs)}
.ch__b a{color:var(--text-primary);border-bottom:1px solid var(--border-soft)}
.ch__b a:hover{border-color:var(--brand-orange)}
.ch__qr{display:block;width:132px;height:132px;margin-top:var(--space-md);border:1px solid var(--border-soft);background:#fff}
@media (max-width:899px){ .ch{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:599px){ .ch{grid-template-columns:minmax(0,1fr)} }

/* ---- square gallery tiles (device images) ---- */
.gl--sq .gl__f{aspect-ratio:1/1;background:#fff}
.gl--sq .gl__f img{object-fit:contain;padding:8%}

/* ---- board rows without links (static notices) ---- */
.bd__r{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-lg);
  padding-block:clamp(20px,2.2vw,30px);flex-wrap:wrap}
.bd__x{flex-basis:100%;font-size:var(--fs-caption);line-height:1.8;color:var(--text-muted);margin-top:var(--space-2xs)}
.bd__tag{font-family:var(--font-display);font-size:var(--fs-caption);letter-spacing:var(--track-wide);
  color:var(--brand-brown);margin-right:var(--space-md)}
.bd__tag--pin{color:var(--brand-orange)}
.bbs-body{font-size:var(--fs-lead);line-height:1.95;color:var(--text-muted);max-width:54ch}
.bbs-body p + p{margin-top:var(--space-lg)}
.bbs-body ul,.bbs-body ol{margin:var(--space-lg) 0;padding-left:1.25em}
.bbs-body a{color:var(--brand-brown);text-decoration:underline;text-underline-offset:2px}
.bbs-body img{display:block;max-width:100%;height:auto;margin:var(--space-lg) 0}
.bbs-media{margin:0 0 var(--space-xl);max-width:min(40rem,100%)}
.bbs-media img{display:block;width:100%;height:auto}

/* ---- definition rows (hours page) ---- */
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--grid-gap)}
.kv__i{border-top:1px solid var(--border-soft);padding-top:var(--space-lg)}
.kv__k{font-family:var(--font-display);font-size:var(--fs-caption);letter-spacing:var(--track-wide);
  text-transform:uppercase;color:var(--brand-brown);font-weight:500}
.kv__v{font-family:var(--font-serif-kr);font-size:var(--fs-h4);color:var(--text-primary);margin-top:var(--space-sm);line-height:1.6}
.kv__n{font-size:var(--fs-caption);line-height:1.8;color:var(--text-muted);margin-top:var(--space-xs)}
.kv__v a{color:inherit}

/* ---- quote block ---- */
.qt{border-left:1px solid var(--brand-orange);padding-left:clamp(20px,3vw,40px);max-width:60ch}
.qt p{font-family:var(--font-display);font-size:var(--fs-h3);font-weight:300;font-style:italic;line-height:1.5;color:var(--text-primary)}
.qt cite{display:block;font-style:normal;font-size:var(--fs-caption);letter-spacing:.08em;color:var(--text-muted);margin-top:var(--space-md)}

/* ---- print ---- */
@media print{ .hdr,.drawer,.mcta,.pcta,.rel{display:none!important} }

/* ---- EN: Korean-serif slots carry English on this site — use the display serif instead ---- */
.h2-kr,.proc__kr,.why__kr,.doc__kr,.feat__kr,.tech__kr{font-family:var(--font-display)}
.h2-kr{letter-spacing:var(--track-display);line-height:1.18;font-weight:300}
.doc__kr{font-size:var(--fs-h4);letter-spacing:.02em}
.doc__kr span{color:var(--muted-on-dark)}
.proc__kr,.why__kr,.tech__kr{font-style:italic;letter-spacing:.02em}
.feat__kr{font-style:italic}
.cs__t,.pt__t,.st__t,.cd__t,.gl__t,.sx__h,.pl__h,.fe__h,.bd__t,.kv__v,.cta__addr{font-family:var(--font-display)}
.sx__h{font-weight:400;letter-spacing:-0.01em;font-size:clamp(1.625rem,2.6vw,2.375rem)}
.cs__t,.pt__t,.st__t,.cd__t,.gl__t,.pl__h,.fe__h,.bd__t,.kv__v{font-size:calc(var(--fs-h4) * 1.12);font-weight:500}
.jr__t{font-size:var(--fs-h2)}
.hero--split .display em{font-style:italic;font-weight:300}

/* ---- lining numerals for labels (Cormorant's old-style figures read poorly in "POINT 1" / "Q1") ---- */
.sx__no,.pt__n,.st__n,.cd__n,.cs__n,.bd__tag,.jr__tag,.crumb__in,.doc__cno,.numeral{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}

/* ---- member archive (gated) ---- */
.members-body{background:var(--bg-secondary)}
.members-hdr{border-bottom:1px solid var(--border-soft);background:var(--bg-primary);position:sticky;top:0;z-index:20}
.members-hdr__in{display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg);padding-block:var(--space-md)}
.members-hdr .brand__logo{height:28px;width:auto}
.members-hdr__nav{display:flex;flex-wrap:wrap;gap:var(--space-md);font-size:var(--fs-caption)}
.members-hdr__nav a{color:var(--text-muted)}
.members-hdr__nav a:hover{color:var(--brand-brown)}
.members-ftr{border-top:1px solid var(--border-soft);padding-block:var(--space-xl);margin-top:var(--space-2xl);font-size:var(--fs-caption);color:var(--text-muted)}
.members-ftr a{color:var(--brand-brown)}
.members-auth{max-width:36rem}
.members-oauth{list-style:none;margin:var(--space-xl) 0;padding:0;display:grid;gap:var(--space-sm)}
.members-oauth__btn{display:block;width:100%;text-align:center}
.members-note{font-size:var(--fs-caption);color:var(--text-muted);line-height:1.7;margin-top:var(--space-lg)}
.members-error{color:#8a2f2f;font-size:var(--fs-body);margin-bottom:var(--space-md)}
.members-consent{display:grid;gap:var(--space-md);margin:var(--space-xl) 0}
.members-check{display:flex;gap:var(--space-sm);align-items:flex-start;font-size:var(--fs-body);line-height:1.6;color:var(--text-primary)}
.members-check input{margin-top:.35em;flex-shrink:0}
.members-check a,.members-legal a{
  color:var(--brand-brown);
  text-decoration:underline;
  text-underline-offset:3px;
  font-weight:500;
}
.members-check a:hover,.members-legal a:hover{color:var(--brand-orange)}
.members-legal{margin:0 0 var(--space-lg);padding:var(--space-md) 0;border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft);font-size:var(--fs-body);line-height:1.7}
.members-legal a{margin-right:var(--space-md)}
.members-group{margin-top:var(--space-2xl)}
.members-group__h{font-family:var(--font-display);font-size:var(--fs-h4);font-weight:500;margin-bottom:var(--space-md)}
.members-catlist{list-style:none;margin:0;padding:0;border-top:1px solid var(--border-soft)}
.members-catlist li{border-bottom:1px solid var(--border-soft)}
.members-catlist a{display:flex;justify-content:space-between;gap:var(--space-lg);padding-block:var(--space-md);color:var(--text-primary)}
.members-catlist a:hover{color:var(--brand-brown)}
.members-catlist__n{color:var(--text-muted);font-size:var(--fs-caption);font-variant-numeric:tabular-nums}
.members-caselist{list-style:none;margin:var(--space-xl) 0 0;padding:0;border-top:1px solid var(--border-soft)}
.members-caselist li{border-bottom:1px solid var(--border-soft)}
.members-caselist a{display:block;padding-block:var(--space-lg);color:inherit}
.members-caselist__t{display:block;font-family:var(--font-display);font-size:var(--fs-h4);font-weight:500}
.members-caselist__s{display:block;margin-top:var(--space-2xs);font-size:var(--fs-caption);color:var(--text-muted)}
.members-ba{display:grid;gap:var(--space-2xl);margin:var(--space-xl) 0}
@media (min-width:768px){.members-ba{grid-template-columns:1fr 1fr}}
.members-ba__h{font-family:var(--font-display);font-size:var(--fs-h4);font-weight:500;margin-bottom:var(--space-md)}
.members-shots{display:grid;gap:var(--space-md)}
.members-shot{margin:0}
.members-shot img{display:block;width:100%;height:auto;background:var(--bg-primary)}

/* ---- icon galleries (65px pictograms from the design used as small marks, not photos) ---- */
.gl--icon .gl__f{aspect-ratio:auto;width:56px;height:56px;border-radius:50%;background:none}
.gl--icon .gl__f img{width:100%;height:100%;object-fit:cover}
.gl--icon .gl__t{margin-top:var(--space-lg)}


/* ---- 2026-10-27 design revision: doctor judgment scenes (consultation, marking, planning, surgery) ---- */
/* 2026-11-02 home doctor scenes: one large photo at a time (slider, site.js) */
.doc__slider{position:relative}
.doc__slider,.doc__dots,.doc__strip .doc__wcap{max-width:960px;margin-left:auto;margin-right:auto}
.doc__scenes{display:grid;aspect-ratio:3/2;margin:0;padding:0;list-style:none;overflow:hidden}
.doc__scenes > li{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s .8s}
.doc__scenes > li.is-on{opacity:1;visibility:visible;transition:opacity .8s ease}
.doc__scenes img{width:100%;height:100%;object-fit:cover}
.doc__nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;padding:0;border:0;border-radius:50%;
  background:rgba(32,24,20,.45);color:#fff;font-size:26px;line-height:44px;cursor:pointer;transition:background .2s}
.doc__nav:hover{background:rgba(32,24,20,.75)}
.doc__nav--prev{left:clamp(8px,1.5vw,20px)} .doc__nav--next{right:clamp(8px,1.5vw,20px)}
.doc__dots{display:flex;justify-content:center;gap:4px;margin-top:var(--space-sm)}
.doc__dots button{width:24px;height:24px;padding:0;border:0;background:none;cursor:pointer}
.doc__dots button::before{content:"";display:block;width:8px;height:8px;margin:auto;border-radius:50%;background:var(--muted-on-dark);opacity:.45}
.doc__dots button[aria-current="true"]::before{background:var(--ink-on-dark);opacity:1}
@media (prefers-reduced-motion:reduce){ .doc__scenes > li,.doc__scenes > li.is-on{transition:none} }

/* ---- 2026-10-31 procedure diagrams (Dr. Jeong's pencil drawings, shown whole on a white card) ---- */
.dg{width:fit-content;max-width:100%;margin:clamp(2rem,3vw,3rem) auto 0;padding:clamp(12px,2.5vw,32px);background:#fff;text-align:center}
/* upright drawings sit beside the text, in the empty right column */
.pr > .dg{width:auto;margin:0}
.dg img{display:inline-block;vertical-align:top;width:auto;height:auto;max-height:440px}
/* long step strips stay legible on phones: fixed height, swipe sideways */
@media (max-width:599px){ .dg--wide{overflow-x:auto;text-align:left} .dg--wide img{max-width:none;max-height:none;height:180px} }