/*
Theme Name: Clinic Skin
Theme URI: https://example.com/clinic-skin
Author: Clinic Skin
Author URI: https://example.com
Description: 범용 피부과 클리닉 테마 — Botanical Herbarium 스타일의 식물 표본 저널 디자인. 자체 콘솔(/console)에서 페이지·장비·칼럼·진료일정·SEO·이미지를 관리하며 MCP를 지원합니다. 병원명·로고·연락처 등 브랜드는 콘솔에서 설정합니다.
Version: 1.7.17
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: clinic-skin
Tags: one-column, custom-logo, custom-menu, editor-style, threaded-comments
*/

@import url("https://cdn.jsdelivr.net/gh/fonts-archive/GangwonEduModu/subsets/GangwonEduModu-dynamic-subset.css");

/* =========================================================
   CLINIC DERMATOLOGY — BLUEBIRD HERBARIUM, Vol. I
   Neutral grayscale palette · botanical journal style
========================================================= */

:root {
  /* ============================================================
     COLOR SYSTEM · brand tokens
     ────────────────────────────────────────────────────────────
     Single source of truth. To re-skin the entire site, edit
     only these three tokens — every downstream color (text,
     surface, overlay, accent) auto-derives via color-mix() and
     CSS relative-color rgb(from …) syntax.
  ============================================================ */
  --brand-primary:   #444C38;   /* main accent · dark blocks · body text */
  --brand-secondary: #f0e9d5;   /* surface base · cream paper · page bg */
  --brand-accent:    #c8bd9f;   /* tertiary · tags · subtle accents */

  /* ============================================================
     INK SCALE — derived from --brand-primary
     (mixed with --brand-secondary so grays inherit paper warmth)
  ============================================================ */
  --ink:     var(--brand-primary);
  --ink-2:   var(--brand-primary);
  --ink-3:   color-mix(in srgb, var(--brand-primary) 80%, var(--brand-secondary));
  --ash:     color-mix(in srgb, var(--brand-primary) 55%, var(--brand-secondary));
  --ash-2:   color-mix(in srgb, var(--brand-primary) 38%, var(--brand-secondary));
  --silver:  color-mix(in srgb, var(--brand-primary) 22%, var(--brand-secondary));

  /* ============================================================
     SURFACE SCALE — derived from --brand-secondary
  ============================================================ */
  --paper:   var(--brand-secondary);
  --soft:    color-mix(in srgb, var(--brand-secondary) 94%, var(--brand-primary));
  --mist:    color-mix(in srgb, var(--brand-secondary) 92%, white);
  --pearl:   color-mix(in srgb, var(--brand-secondary) 85%, var(--brand-primary));

  /* ============================================================
     ACCENT — derived from --brand-accent
  ============================================================ */
  --kraft:   var(--brand-accent);

  /* ============================================================
     LEGACY ALIASES (back-compat with existing rules)
  ============================================================ */
  --forest:    var(--ink-3);
  --forest-2:  var(--ink-2);
  --forest-3:  color-mix(in srgb, var(--brand-primary) 92%, black);
  --moss:      var(--ash);
  --moss-2:    var(--ash-2);
  --sage:      var(--pearl);
  --sage-2:    var(--silver);
  --leaf:      var(--ash-2);
  --white:     #ffffff;
  --ivory:     var(--soft);
  --cream:     var(--mist);
  --muted:     var(--ash);

  --line: rgba(0, 0, 0, 0.12);
  --line-strong: rgba(0, 0, 0, 0.22);
  --line-dotted: rgba(0, 0, 0, 0.32);
  --line-light: rgba(255, 255, 255, 0.22);
  --line-light-dotted: rgba(255, 255, 255, 0.3);

  --serif: "Cormorant Garamond", "Nanum Myeongjo", "Noto Serif KR", Georgia,
    "Times New Roman", serif;
  --script: "Italianno", "Cormorant Garamond", cursive;
  --sans: "Pretendard", "Noto Sans KR", "Apple SD Gothic Neo", Arial, sans-serif;

  --gutter: clamp(24px, 6vw, 88px);
  --section-pad-y: clamp(80px, 11vw, 160px);
  --content-max: 1200px;

  --paper-grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.04 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  color: var(--ink);
  font-family: var(--sans);
  word-break: keep-all;
  overflow-wrap: break-word;
  letter-spacing: 0;
  background-color: var(--paper);
  background-image:
    var(--paper-grain),
    radial-gradient(ellipse at top, var(--mist) 0%, var(--paper) 35%, var(--soft) 100%);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

/* ============================================================
   PRIMITIVES
============================================================ */

.italic, em.italic, span.italic { font-style: italic; }

.script {
  font-family: var(--script);
  font-weight: 400;
  letter-spacing: 0.01em;
}

.latin {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 0.06em;
  color: var(--ash);
}

.label {
  display: inline-block;
  margin: 0 0 12px;
  color: var(--ash);
  font-family: var(--sans);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.32em;
  text-transform: uppercase;
}

.display {
  margin: 0;
  color: var(--ink-2);
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(36px, 4.4vw, 60px);
  line-height: 1.12;
  letter-spacing: -0.005em;
  word-break: keep-all;
}
.display.xl {
  font-size: clamp(52px, 7vw, 96px);
  font-weight: 300;
}
.display .italic {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-3);
}

.lead {
  max-width: 640px;
  margin: 28px auto 0;
  color: var(--ink);
  font-family: var(--serif);
  font-size: 19px;
  line-height: 1.86;
}
.lead-sm {
  max-width: 460px;
  margin: 14px 0 0;
  color: var(--ash);
  font-family: var(--serif);
  font-style: italic;
  font-size: 15px;
  line-height: 1.8;
}

.rule-thin {
  display: block;
  width: 64px;
  height: 1px;
  margin: 24px 0 0;
  background: var(--line-strong);
}
.specimen-header.centered .rule-thin { margin-left: auto; margin-right: auto; }

.ornament-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 24px var(--gutter);
}
.ornament-divider .rule {
  flex: 1;
  max-width: 260px;
  height: 1px;
  background: var(--line);
}
.ornament-divider img {
  width: 220px;
  max-width: 30vw;
  opacity: 0.7;
  mix-blend-mode: multiply;
  filter: grayscale(1);
}
.ornament-divider img.small { width: 60px; }

/* ============================================================
   MASTHEAD
============================================================ */

.masthead {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10;
  padding: 64px var(--gutter) 0;
  text-align: center;
  /* 흰색 로고·메뉴 가독성 확보용 — 헤더 대부분 80%↑ 불투명도 유지,
     하단 끝부분(75% → 100%)에서만 빠르게 페이드. */
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--brand-primary) 95%, transparent) 0%,
    color-mix(in srgb, var(--brand-primary) 90%, transparent) 60%,
    color-mix(in srgb, var(--brand-primary) 82%, transparent) 75%,
    transparent 100%
  );
  backdrop-filter: none;
  color: rgba(255, 255, 255, 0.92);
}

.masthead-row {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 28px;
  padding-bottom: 22px;
}

.masthead-meta {
  display: flex;
  align-items: center;
  gap: 14px;
  color: rgba(255, 255, 255, 0.78);
  font-family: var(--serif);
  font-size: 14px;
  font-style: italic;
  letter-spacing: 0.06em;
  min-width: 0;
}
.masthead-meta.left { justify-content: flex-start; }
.masthead-meta .meta-text { white-space: nowrap; }

.masthead-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  min-width: 0;
}

.masthead-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1;
  gap: 8px;
}
.masthead-title > * { margin: 0; }
.masthead-title .title-kr-link {
  display: block;
  text-align: center;
}

.masthead-ornament {
  width: 50px;
  height: 50px;
  display: block;
  object-fit: contain;
  opacity: 0.92;
  mix-blend-mode: normal;
  filter: brightness(0) invert(1);
}
.custom-logo {
  width: 50px !important;
  height: 50px !important;
  max-width: 50px;
  max-height: 50px;
  object-fit: contain;
  display: block;
}
.custom-logo-link {
  display: inline-block;
  line-height: 0;
}

.masthead-title .title-kr {
  display: block;
  text-align: center;
  font-family: "GangwonEdu Modu", var(--serif);
  font-weight: 600;
  font-size: 30px;
  color: rgba(255, 255, 255, 0.96);
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.25);
}

/* Hamburger lives inside masthead-meta.right; hidden on desktop */
.masthead-hamburger {
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: 4px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
}
.masthead-hamburger span {
  display: block;
  width: 18px;
  height: 1.5px;
  background: rgba(255, 255, 255, 0.95);
  position: relative;
}
.masthead-hamburger span::before,
.masthead-hamburger span::after {
  content: "";
  position: absolute;
  left: 0;
  width: 18px;
  height: 1.5px;
  background: rgba(255, 255, 255, 0.95);
}
.masthead-hamburger span::before { top: -6px; }
.masthead-hamburger span::after { top: 6px; }

/* ============================================================
   PRIMARY NAVIGATION
============================================================ */

.masthead-nav {
  margin-top: 12px;
  padding: 12px var(--gutter) 80px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}
.masthead-nav .nav-list,
.masthead-nav .sub-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.masthead-nav .nav-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: clamp(20px, 2.6vw, 38px);
  font-family: var(--sans);
  font-size: 13.5px;
}
.masthead-nav .nav-list > li {
  position: relative;
}
.masthead-nav .nav-list > li > a {
  display: inline-block;
  padding: 8px 4px;
  color: rgba(255, 255, 255, 0.86);
  font-weight: 500;
  letter-spacing: 0.04em;
  white-space: nowrap;
  transition: color 180ms ease;
}
.masthead-nav .nav-list > li > a:hover,
.masthead-nav .nav-list > li:focus-within > a {
  color: var(--white);
}

/* Desktop dropdown */
.masthead-nav .sub-list {
  position: absolute;
  top: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%) translateY(-4px);
  min-width: 240px;
  padding: 14px 0;
  background: var(--ink-2);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.35);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 200ms ease, transform 200ms ease, visibility 0s linear 200ms;
  z-index: 5;
}
/* 메가메뉴 — nav 어디든 hover/focus 하면 모든 탑레벨의 서브가 동시에 펼쳐짐.
   개별 li hover 도 그대로 유지(키보드 포커스 포함) → 단일 항목 진입 시에도 자연스럽게 동작. */
.masthead-nav .nav-list > li:hover > .sub-list,
.masthead-nav .nav-list > li:focus-within > .sub-list,
.masthead-nav:hover .nav-list > li > .sub-list,
.masthead-nav:focus-within .nav-list > li > .sub-list {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
  transition: opacity 200ms ease, transform 200ms ease;
}
.masthead-nav .sub-list a {
  display: block;
  padding: 9px 22px;
  color: rgba(255, 255, 255, 0.76);
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.03em;
  white-space: nowrap;
  transition: background 160ms ease, color 160ms ease;
}
.masthead-nav .sub-list a:hover {
  color: var(--white);
  background: rgba(255, 255, 255, 0.06);
}
.masthead-nav .sub-list .sub-list--deep {
  position: static;
  transform: none;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  margin: 4px 0 8px 16px;
  padding: 4px 0;
  background: transparent;
  border: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: none;
  min-width: 0;
}
.masthead-nav .sub-list .sub-list--deep a {
  padding: 5px 18px;
  font-size: 12.5px;
  color: rgba(255, 255, 255, 0.62);
  font-style: italic;
}
.masthead-nav .sub-list .sub-list--deep a:hover {
  background: transparent;
  color: rgba(255, 255, 255, 0.95);
}

/* Mobile-only toggle button injected by JS — hidden on desktop */
.nav-toggle { display: none; }

/* ============================================================
   MEGAMENU — Desktop only (JS-injected)
   nav 어디든 hover/focus 하면 헤더 아래 다크 솔리드 패널이 페이드인.
   sub-list 들을 한 패널 안에 균등 컬럼으로 정렬한다(JS 가 복제 삽입).
   기존 individual .sub-list 드롭다운은 데스크탑에서 비활성화.
============================================================ */
.masthead-mega { display: none; }

.masthead-mega__grid {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 24px;
  max-width: var(--content-max, 1200px);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.masthead-mega__col {
  flex: 1;
  min-width: 0;
  padding: 0 18px;
  border-right: 1px solid rgba(255, 255, 255, 0.14);
  text-align: center;
}
.masthead-mega__col:last-child { border-right: 0; }

.masthead-mega__parent {
  display: block;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--white);
}

.masthead-mega__children {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.masthead-mega__children a {
  display: block;
  padding: 7px 10px;
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.7);
  border-radius: 4px;
  transition: background 160ms ease, color 160ms ease;
}
.masthead-mega__children a:hover {
  color: var(--white);
  background: rgba(255, 255, 255, 0.08);
}

/* 3차(depth-3) 플라이아웃 — 2차 항목에 hover 하면 오른쪽에 모달 팝업으로 펼쳐짐 */
.masthead-mega__children > li { position: relative; }
.masthead-mega__children > li.has-flyout > a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.masthead-mega__caret {
  font-size: 12px;
  line-height: 1;
  opacity: 0.6;
  transition: opacity 160ms ease;
}
.masthead-mega__children > li.has-flyout:hover > a .masthead-mega__caret,
.masthead-mega__children > li.has-flyout:focus-within > a .masthead-mega__caret {
  opacity: 1;
}
.masthead-mega__flyout {
  list-style: none;
  margin: 0;
  padding: 8px 0;
  position: absolute;
  top: -8px;
  left: 100%;
  min-width: 190px;
  background: var(--ink-2);
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(-6px);
  transition: opacity 180ms ease, transform 180ms ease, visibility 0s linear 180ms;
  z-index: 6;
  text-align: left;
}
.masthead-mega__children > li.has-flyout:hover > .masthead-mega__flyout,
.masthead-mega__children > li.has-flyout:focus-within > .masthead-mega__flyout {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(0);
  transition: opacity 180ms ease, transform 180ms ease;
}
/* 우측 절반 컬럼은 화면 밖으로 나가지 않도록 왼쪽으로 펼침 */
.masthead-mega__col--flip .masthead-mega__flyout {
  left: auto;
  right: 100%;
  transform: translateX(6px);
}
.masthead-mega__col--flip .masthead-mega__children > li.has-flyout:hover > .masthead-mega__flyout,
.masthead-mega__col--flip .masthead-mega__children > li.has-flyout:focus-within > .masthead-mega__flyout {
  transform: translateX(0);
}
.masthead-mega__flyout li { margin: 0; }
.masthead-mega__flyout a {
  display: block;
  padding: 7px 18px;
  font-family: var(--sans);
  font-size: 12.5px;
  font-weight: 400;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.72);
  white-space: nowrap;
  border-radius: 0;
  transition: background 160ms ease, color 160ms ease;
}
.masthead-mega__flyout a:hover {
  color: var(--white);
  background: rgba(255, 255, 255, 0.08);
}

@media (min-width: 1081px) {
  .masthead.megamenu-ready .masthead-mega {
    display: block;
    position: absolute;
    top: 78%;
    left: 0;
    right: 0;
    background: var(--ink-2);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    border-bottom: 1px solid var(--brand-accent);
    padding: 32px 0 40px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 220ms ease, visibility 220ms ease;
    z-index: 5;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.18);
  }
  .masthead.megamenu-ready:hover .masthead-mega,
  .masthead.megamenu-ready:focus-within .masthead-mega {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  /* 데스크탑에선 개별 li 드롭다운(.sub-list)을 끄고 메가패널로만 보여줌 */
  .masthead.megamenu-ready .masthead-nav .sub-list {
    display: none !important;
  }
}

@media (max-width: 1080px) {
  /* 모바일 — 메가패널 사용 안 함, 기존 드로어 메뉴(.sub-list)가 처리 */
  .masthead-mega { display: none !important; }
}

/* ============================================================
   COVER — full-bleed cinematic hero
============================================================ */

.cover {
  position: relative;
  padding: 0;
  margin: 0;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: var(--ink-2);
}

/* Hero rotating slides — replaces .cover::before single image */
.hero-slides {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.hero-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
  animation: hero-rotate 24s infinite ease-in-out;
}
.hero-slide-1 { animation-delay: 0s; }
.hero-slide-2 { animation-delay: -16s; }
.hero-slide-3 { animation-delay: -8s; }

@keyframes hero-rotate {
  0%, 29% { opacity: 1; }
  33%, 96% { opacity: 0; }
  100% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-slide { animation: none; }
  .hero-slide-1 { opacity: 1; }
  .hero-slide-2,
  .hero-slide-3 { opacity: 0; }
}
.cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg,
      rgb(from var(--brand-primary) r g b / 0.82) 0%,
      rgb(from var(--brand-primary) r g b / 0.42) 28%,
      rgb(from var(--brand-primary) r g b / 0.5) 70%,
      rgb(from var(--brand-primary) r g b / 0.88) 100%),
    linear-gradient(90deg,
      rgb(from var(--brand-primary) r g b / 0.58) 0%,
      rgb(from var(--brand-primary) r g b / 0.14) 38%,
      rgb(from var(--brand-primary) r g b / 0.14) 62%,
      rgb(from var(--brand-primary) r g b / 0.46) 100%);
  z-index: 1;
}

.cover-frame {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100vh;
  padding: clamp(160px, 18vw, 240px) clamp(28px, 7vw, 110px) clamp(80px, 9vw, 140px);
  color: var(--white);
  text-align: left;
}

.cover-overline {
  position: relative;
  margin: 0 0 22px;
  color: var(--pearl);
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.36em;
  text-transform: uppercase;
}

.cover-title {
  position: relative;
  margin: 0;
  font-family: var(--serif);
  font-weight: 300;
  line-height: 0.96;
  color: var(--white);
  max-width: 720px;
  text-shadow: 0 6px 30px rgba(0, 0, 0, 0.35);
}
.cover-title .line {
  display: block;
  font-size: clamp(56px, 8.4vw, 132px);
  letter-spacing: -0.005em;
}
.cover-title .line.italic {
  font-style: italic;
  font-weight: 400;
  color: var(--white);
  text-indent: 0.5em;
}
.cover-title .line.script { display: none; }

.cover-script {
  position: relative;
  margin: 26px 0 0;
  color: var(--pearl);
  font-family: var(--script);
  font-size: clamp(28px, 2.6vw, 42px);
  letter-spacing: 0;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.cover-art { display: none; }

.cover-credits {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: 36px;
  margin-top: 56px;
  padding-top: 28px;
  border-top: 1px solid rgba(255, 255, 255, 0.32);
  max-width: 720px;
}
.cover-credits > div {
  display: grid;
  gap: 6px;
  text-align: left;
}
.cover-credits .label { color: var(--pearl); margin: 0; }
.cover-credits strong {
  color: var(--white);
  font-family: var(--serif);
  font-weight: 500;
  font-size: 19px;
  letter-spacing: 0.02em;
}
.cover-credits strong em { font-style: italic; font-weight: 400; }
.cover-credits .latin { font-size: 13px; color: var(--silver); }
.cover-credits .cover-rule {
  width: 1px;
  background: rgba(255, 255, 255, 0.24);
}

.cover + .ornament-divider {
  padding-top: 36px;
  padding-bottom: 36px;
}

/* ============================================================
   SPECIMEN HEADER
============================================================ */

.specimen-header { margin: 0 0 64px; }
.specimen-header.centered { text-align: center; }

.specimen-header .folio {
  display: inline-block;
  padding: 4px 14px;
  margin-bottom: 18px;
  border: 1px solid var(--line-strong);
  font-family: var(--serif);
  font-style: italic;
  font-size: 13px;
  letter-spacing: 0.16em;
  color: var(--ash);
  background: rgba(255, 255, 255, 0.5);
}
.specimen-header .display { margin: 0 0 12px; }
.specimen-header .header-icon {
  display: block;
  width: 110px;
  height: 110px;
  margin: 8px auto 16px;
  opacity: 0.8;
  mix-blend-mode: multiply;
  filter: grayscale(1);
}
.specimen-header .latin { display: block; margin: 4px 0 0; }
.specimen-header.centered .folio { margin-bottom: 14px; }

/* ============================================================
   FEATURE
============================================================ */

.feature {
  position: relative;
  padding: var(--section-pad-y) var(--gutter);
  background: transparent;
  max-width: var(--content-max);
  margin-left: auto;
  margin-right: auto;
}

.ornament-divider {
  max-width: var(--content-max);
  margin-left: auto;
  margin-right: auto;
}

.specimen-body.two-col {
  display: grid;
  grid-template-columns: minmax(280px, 0.95fr) minmax(300px, 1.05fr);
  gap: clamp(40px, 5vw, 80px);
  align-items: center;
}

.specimen-body.centered { text-align: center; max-width: 1080px; margin: 0 auto; }

/* ============================================================
   HERBARIUM CARD
============================================================ */

.herbarium-card { margin: 0; }

.herbarium-card-inner {
  position: relative;
  padding: clamp(18px, 2vw, 28px);
  background-color: #ffffff;
  background-image:
    var(--paper-grain),
    linear-gradient(180deg, #ffffff, #f5f5f4);
  border: 1px solid rgba(0, 0, 0, 0.12);
  box-shadow:
    0 16px 38px rgba(0, 0, 0, 0.08),
    0 1px 0 rgba(255, 255, 255, 0.6) inset;
}

.herbarium-card-inner img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  filter: saturate(0.65) contrast(0.99);
}

.herbarium-tag {
  position: relative;
  margin-top: 18px;
  padding: 14px 14px 14px 18px;
  background: var(--kraft);
  background-image: linear-gradient(180deg, #dcdad6, #cfcdca);
  border: 1px solid rgba(0, 0, 0, 0.18);
  display: grid;
  gap: 4px;
  font-family: var(--serif);
  color: var(--ink-3);
}
.herbarium-tag .latin { color: var(--ink-3); font-size: 13px; }
.herbarium-tag span:not(.latin) {
  font-size: 12px;
  font-style: normal;
  letter-spacing: 0.04em;
  color: var(--ash);
}
.herbarium-tag em { font-size: 12px; font-style: italic; color: var(--ash-2); }
.herbarium-tag::before {
  content: "";
  position: absolute;
  left: -8px; top: 50%;
  transform: translateY(-50%);
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--paper);
  border: 1px solid rgba(0, 0, 0, 0.22);
}
.herbarium-tag.tall { padding-bottom: 18px; }

/* ============================================================
   PROFILE
============================================================ */

.specimen-text { padding-top: 6px; }

.specimen-dl {
  margin: 0 0 32px;
  padding: 0 0 22px;
  border-bottom: 1px dashed var(--line-dotted);
  display: grid;
  gap: 14px;
}
.specimen-dl > div {
  display: grid;
  grid-template-columns: 110px 1fr;
  align-items: baseline;
  gap: 20px;
}
.specimen-dl dt {
  margin: 0;
  color: var(--ash);
  font-family: var(--serif);
  font-style: italic;
  font-size: 14px;
  letter-spacing: 0.04em;
}
.specimen-dl dd {
  margin: 0;
  color: var(--ink-2);
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.01em;
}
.specimen-dl dd em { font-style: italic; font-weight: 400; color: var(--ash); }

.drop-cap {
  margin: 0;
  color: var(--ink);
  font-family: var(--serif);
  font-size: 19px;
  line-height: 1.84;
}
.drop-cap::first-letter {
  float: left;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 500;
  font-size: 64px;
  line-height: 0.9;
  padding: 6px 12px 0 0;
  color: var(--ink-2);
}

/* 의료진 소개글 — 오른쪽 컬럼 본문 */
.doctor-intro {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px dashed var(--line-dotted);
}
.doctor-intro p {
  margin: 0 0 14px;
  color: var(--ink);
  font-family: var(--serif);
  font-size: 16px;
  line-height: 1.85;
  word-break: keep-all;
}
.doctor-intro p:last-child { margin-bottom: 0; }
.doctor-intro-lead {
  font-family: var(--serif) !important;
  font-style: italic;
  font-size: clamp(20px, 1.6vw, 24px) !important;
  font-weight: 500;
  line-height: 1.35 !important;
  color: var(--ink-2);
  margin-bottom: 22px !important;
  letter-spacing: 0.01em;
}

/* 의료진 섹션 하단 — 인용 멘트 (풀-가로) */
.doctor-note {
  position: relative;
  margin: clamp(48px, 6vw, 80px) auto 0;
  max-width: 760px;
  padding: clamp(24px, 3vw, 36px) clamp(20px, 4vw, 56px) 0;
  text-align: center;
}
.doctor-note-mark {
  display: block;
  font-family: var(--serif);
  font-size: clamp(72px, 7vw, 110px);
  line-height: 0.5;
  color: var(--silver);
  opacity: 0.6;
  margin-bottom: 4px;
  user-select: none;
  pointer-events: none;
}
.doctor-note p {
  margin: 0;
  color: var(--ink-2);
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(20px, 1.8vw, 26px);
  font-weight: 400;
  line-height: 1.65;
  word-break: keep-all;
}

.signature.script {
  margin: 22px 0 0;
  font-family: var(--script);
  font-size: 38px;
  color: var(--ink-2);
}

/* ============================================================
   MANIFESTO — DARK CHARCOAL ACCENT BLOCK
============================================================ */

.feature.manifesto {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}
.manifesto {
  position: relative;
  background-color: var(--ink-2);
  color: rgba(255, 255, 255, 0.92);
  isolation: isolate;
}
.manifesto > .specimen-header,
.manifesto > .specimen-body {
  max-width: var(--content-max);
  margin-left: auto;
  margin-right: auto;
}

.manifesto .specimen-header { position: relative; z-index: 1; }
.manifesto .specimen-body { position: relative; z-index: 1; }

.manifesto > .specimen-body.two-col {
  position: relative;
  background: none !important;
}
.manifesto > .specimen-body.two-col::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--bg-art, none) right center / 60% auto no-repeat;
  filter: grayscale(1) brightness(1.1);
  opacity: 0.32;
  mix-blend-mode: lighten;
  pointer-events: none;
  z-index: 0;
}
.manifesto > .specimen-body.two-col > * { position: relative; z-index: 1; }

.manifesto .specimen-header .folio {
  border-color: rgba(255, 255, 255, 0.35);
  color: rgba(255, 255, 255, 0.78);
  background: rgba(255, 255, 255, 0.05);
}
.manifesto .display { color: var(--white); }
.manifesto .display .italic { color: var(--pearl); }
.manifesto .latin { color: rgba(255, 255, 255, 0.7); }
.manifesto .rule-thin { background: rgba(255, 255, 255, 0.32); }

.pullquote { margin: 0; position: relative; padding-left: 28px; }
.pullquote .quote-mark {
  position: absolute;
  top: -32px; left: -10px;
  font-family: var(--serif);
  font-size: 140px;
  line-height: 1;
  color: var(--silver);
  opacity: 0.75;
}
.pullquote p {
  margin: 0;
  color: var(--white);
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(34px, 4vw, 60px);
  line-height: 1.18;
  word-break: keep-all;
}
.pullquote p em { font-style: italic; font-weight: 400; color: var(--pearl); }

.manifesto-copy {
  padding-left: 32px;
  border-left: 1px solid rgba(255, 255, 255, 0.26);
}
.manifesto .drop-cap { color: rgba(255, 255, 255, 0.92); }
.manifesto .drop-cap::first-letter { color: var(--pearl); }

/* 매니페스토 — 중앙 단일 문장 변형 */
.manifesto-statement {
  position: relative;
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 clamp(20px, 4vw, 80px);
  text-align: center;
}
.manifesto-statement-mark {
  display: block;
  font-family: var(--serif);
  font-size: clamp(96px, 9vw, 160px);
  line-height: 0.4;
  color: var(--silver);
  opacity: 0.7;
  margin-bottom: 16px;
  user-select: none;
  pointer-events: none;
}
.manifesto-statement p {
  margin: 0;
  color: var(--white);
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(26px, 3vw, 44px);
  line-height: 1.4;
  letter-spacing: -0.005em;
  word-break: keep-all;
}

.signature-line {
  margin: 30px 0 0;
  display: flex;
  align-items: baseline;
  gap: 16px;
  padding-top: 22px;
  border-top: 1px dashed rgba(255, 255, 255, 0.32);
}
.signature-line span:first-child {
  color: rgba(255, 255, 255, 0.7);
  font-family: var(--serif);
  font-size: 14px;
  letter-spacing: 0.04em;
}
.signature-line .script {
  color: var(--white);
  font-family: var(--script);
  font-size: 36px;
}

/* ============================================================
   LIFTING
============================================================ */

.lifting { background: transparent; }
.lifting .specimen-body.centered { max-width: 980px; }
.lifting-plate { margin: 56px auto 0; max-width: 920px; }
.lifting-plate .herbarium-card-inner img {
  aspect-ratio: 16 / 9;
  filter: saturate(0.55) contrast(1.02);
}

/* ============================================================
   TREATMENT INDEX
============================================================ */

.treatments {
  text-align: center;
  position: relative;
  background: transparent;
}
.treatments .specimen-header { text-align: center; }
.treatments .specimen-header .lead-sm { margin-left: auto; margin-right: auto; }
.treatments .specimen-header .rule-thin { margin: 24px auto 0; }

.specimen-grid {
  list-style: none;
  margin: 36px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 36px;
}
.specimen-grid li { margin: 0; }

.specimen-card {
  position: relative;
  margin: 0;
  padding: 36px 36px 28px;
  background-color: #ffffff;
  background-image:
    var(--paper-grain),
    linear-gradient(180deg, #ffffff, #f3f3f2);
  border: 1px solid rgba(0, 0, 0, 0.12);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.06);
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 24px;
  align-items: start;
  text-align: left;
  transition: transform 200ms ease, box-shadow 200ms ease;
}
.specimen-grid a:hover .specimen-card {
  transform: translateY(-4px);
  box-shadow: 0 22px 48px rgba(0, 0, 0, 0.12);
}
.specimen-card::before {
  content: "";
  position: absolute;
  top: 14px; left: 14px; right: 14px; bottom: 14px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  pointer-events: none;
}
.card-no {
  position: absolute;
  top: 16px; right: 22px;
  font-family: var(--serif);
  font-style: italic;
  font-size: 15px;
  letter-spacing: 0.16em;
  color: var(--ash);
}
.card-icon {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  opacity: 0.92;
  mix-blend-mode: multiply;
  filter: grayscale(1);
}
.specimen-card figcaption { display: grid; gap: 6px; margin: 0; }
.specimen-card .latin {
  display: block;
  margin: 0;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--ash);
}
.specimen-card h3 {
  margin: 4px 0 6px;
  color: var(--ink-2);
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(22px, 2.2vw, 28px);
  line-height: 1.2;
}
.specimen-card p {
  margin: 0;
  color: var(--ash);
  font-family: var(--serif);
  font-size: 14px;
  line-height: 1.6;
}
.specimen-card .card-rule {
  display: block;
  margin: 12px 0 8px;
  width: 36px;
  height: 1px;
  background: rgba(0, 0, 0, 0.4);
}
.specimen-card .hint {
  font-style: italic;
  color: var(--ash);
  font-size: 13px;
  letter-spacing: 0.03em;
}

.editorial-cta {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin: 56px auto 0;
  padding: 14px 0;
  border-top: 1px solid var(--ink-2);
  border-bottom: 1px solid var(--ink-2);
  color: var(--ink-2);
  font-family: var(--serif);
  font-style: italic;
  font-size: 18px;
  letter-spacing: 0.04em;
  transition: letter-spacing 200ms ease;
}
.editorial-cta em { font-style: normal; font-family: var(--sans); }
.editorial-cta:hover { letter-spacing: 0.12em; }

/* ============================================================
   PORTFOLIO
============================================================ */

.portfolio {
  position: relative;
  background: transparent;
}
.feature.portfolio {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.portfolio-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 26px;
  align-items: start;
}
.portfolio-grid li { margin: 0; }
.portfolio-grid .offset { transform: translateY(60px); }

.portfolio-grid .herbarium-card-inner img {
  aspect-ratio: 3 / 4;
  object-position: left bottom;
  filter: saturate(0.55) contrast(1.02);
}
.portfolio-grid .paper .herbarium-card-inner img,
.portfolio-grid li:nth-child(3) .herbarium-card-inner img,
.portfolio-grid li:nth-child(4) .herbarium-card-inner img {
  object-position: center;
}
.portfolio-grid .paper .herbarium-card-inner img {
  object-fit: contain;
  background: #ffffff;
  filter: grayscale(1) brightness(1.04) contrast(0.98);
}

/* ============================================================
   DESIGN NOTE
============================================================ */

.design-note .specimen-body.split { align-items: center; }
.design-note .specimen-text p {
  color: var(--ink);
  font-family: var(--serif);
  font-size: 19px;
  line-height: 1.85;
  margin: 0;
}
.note-list {
  list-style: none;
  padding: 22px 0;
  margin: 28px 0 0;
  display: grid;
  gap: 12px;
  font-family: var(--serif);
  font-size: 16px;
  color: var(--ink-2);
  border-top: 1px dashed var(--line-dotted);
  border-bottom: 1px dashed var(--line-dotted);
}
.note-list li { display: flex; align-items: baseline; gap: 10px; }
.note-list .bullet { color: var(--ash-2); font-size: 14px; }
.design-note .signature.script { margin-top: 22px; }

/* ============================================================
   REVIEWS (Specimen No. VI · Naver Place slider)
   풀-블리드 + 다중 카드 그리드 슬라이더 (4 / 3 / 2 / 1)
============================================================ */

.feature.reviews {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}
.reviews .specimen-header {
  max-width: var(--content-max, 1200px);
  margin-left: auto;
  margin-right: auto;
  padding: 0 var(--gutter);
  margin-bottom: 56px;
}

.reviews-stage {
  position: relative;
  max-width: none;
  margin: 0;
  padding: 0 clamp(20px, 4vw, 72px);
}
.reviews-viewport {
  overflow-x: auto;
  overflow-y: visible;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
  padding: 14px 0 26px;
  margin: -14px 0 -26px;
}
.reviews-viewport::-webkit-scrollbar { display: none; }
.reviews-track {
  --gap: clamp(16px, 1.6vw, 28px);
  --visible: 4;
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: var(--gap);
}
.review-slide {
  flex: 0 0 calc((100% - var(--gap) * (var(--visible) - 1)) / var(--visible));
  scroll-snap-align: start;
  box-sizing: border-box;
  transition: opacity 420ms ease;
}
.review-card {
  position: relative;
  padding: clamp(28px, 2.8vw, 44px) clamp(22px, 2.2vw, 32px) clamp(20px, 2vw, 32px);
  min-height: 360px;
  background-color: #ffffff;
  background-image:
    var(--paper-grain),
    linear-gradient(180deg, #ffffff, #faf6ec);
  border: 1px solid rgba(0, 0, 0, 0.12);
  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.06),
    0 1px 0 rgba(255, 255, 255, 0.6) inset;
  display: flex;
  flex-direction: column;
  gap: 18px;
  height: 100%;
}
.review-quote-mark {
  position: absolute;
  top: clamp(2px, 0.8vw, 10px);
  left: clamp(10px, 1.4vw, 22px);
  font-family: var(--serif);
  font-size: clamp(60px, 5vw, 96px);
  line-height: 1;
  color: var(--silver);
  opacity: 0.5;
  pointer-events: none;
  user-select: none;
}
.review-meta {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: baseline;
  font-family: var(--serif);
  font-size: 13px;
  color: var(--ash);
  letter-spacing: 0.04em;
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--line-dotted);
}
.review-meta .review-author {
  color: var(--ink-2);
  font-style: italic;
  font-weight: 500;
  font-size: 15px;
  letter-spacing: 0.03em;
}
.review-meta .review-date,
.review-meta .review-visit { font-style: italic; }
.review-meta .review-sep { color: var(--silver); }
.review-body {
  position: relative;
  z-index: 1;
  margin: 0;
  flex: 1;
  max-height: 16em;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, #000 75%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 75%, transparent 100%);
}
.review-body p {
  margin: 0;
  color: var(--ink);
  font-family: var(--serif);
  font-size: clamp(14px, 0.95vw, 16px);
  line-height: 1.7;
  word-break: keep-all;
  overflow-wrap: break-word;
}
.review-source {
  position: relative;
  z-index: 1;
  margin: 0;
  align-self: flex-end;
  font-size: 11px !important;
  letter-spacing: 0.16em;
  color: var(--ash);
}

.review-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  cursor: pointer;
  font-family: var(--serif);
  font-size: 26px;
  line-height: 1;
  color: var(--ink-2);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
  padding: 0 0 4px;
  transition: background 200ms ease, border-color 200ms ease, color 200ms ease;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
}
.review-nav:hover {
  background: var(--ink-2);
  border-color: var(--ink-2);
  color: #ffffff;
}
.review-nav.prev { left: clamp(4px, 1vw, 20px); }
.review-nav.next { right: clamp(4px, 1vw, 20px); }

.review-dots {
  display: flex;
  justify-content: center;
  gap: 7px;
  margin-top: 28px;
  flex-wrap: wrap;
  padding: 0 var(--gutter);
}
.review-dot {
  width: 7px;
  height: 7px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--silver);
  cursor: pointer;
  opacity: 0.5;
  transition: opacity 200ms, background 200ms, transform 200ms;
}
.review-dot:hover { opacity: 1; }
.review-dot.is-active {
  background: var(--ink-2);
  opacity: 1;
  transform: scale(1.4);
}

@media (max-width: 1279px) {
  .reviews-track { --visible: 3; }
}
@media (max-width: 980px) {
  .reviews-track { --visible: 2; }
  .review-card { min-height: 340px; }
}
@media (max-width: 640px) {
  .reviews-stage { padding: 0 14px; }
  .reviews-track { --visible: 1.1; --gap: 12px; }
  .review-card {
    min-height: 300px;
    padding: 28px 20px 22px;
    gap: 14px;
  }
  .review-quote-mark { font-size: 60px; top: 0; left: 6px; }
  .review-body { max-height: 14em; }
  .review-body p { font-size: 14.5px; line-height: 1.7; }
  .review-meta { font-size: 12px; }
  .review-meta .review-author { font-size: 14px; }
  .review-nav { width: 38px; height: 38px; font-size: 22px; }
  .review-nav.prev { left: 2px; }
  .review-nav.next { right: 2px; }
}

/* ============================================================
   COMMUNITY (Specimen No. VII · News, Articles & Events)
   /community 통합 피드 — 메인 카드 리스트 + 우측 사이드바
============================================================ */

.feature.community {
  max-width: var(--content-max, 1200px);
  /* 히어로(.cmty-hero)가 전폭 밴드로 분리됨 → 옛 마스트헤드용 상단 패딩 제거. */
  padding-top: 0;
}
.community .specimen-header { margin-bottom: 36px; }

/* 카테고리 필터 칩 */
.community-filter {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 0 0 44px;
}
.community-chip {
  display: inline-flex;
  align-items: center;
  padding: 8px 18px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  font-family: var(--serif);
  font-style: italic;
  font-size: 14px;
  letter-spacing: 0.04em;
  color: var(--ash);
  background: rgba(255, 255, 255, 0.4);
  transition: all 180ms ease;
}
.community-chip:hover {
  color: var(--ink-2);
  border-color: var(--ink-2);
  background: rgba(255, 255, 255, 0.7);
}
.community-chip.is-active {
  background: var(--ink-2);
  border-color: var(--ink-2);
  color: var(--white);
}

/* 레이아웃 — 메인 + 사이드바 */
.community-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: clamp(28px, 3vw, 48px);
  align-items: start;
}

/* 카드 */
.community-list { display: grid; gap: 22px; }
.community-card {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: clamp(20px, 2.5vw, 32px);
  padding: clamp(18px, 2vw, 28px);
  background-color: #ffffff;
  background-image: var(--paper-grain), linear-gradient(180deg, #ffffff, #faf7f0);
  border: 1px solid var(--line);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(255, 255, 255, 0.6) inset;
}
.community-card-thumb {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--mist);
  border: 1px solid rgba(0, 0, 0, 0.06);
}
.community-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 400ms ease;
}
.community-card-thumb:hover img { transform: scale(1.04); }
.community-card-thumb-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--serif);
  font-size: 42px;
  color: var(--silver);
  opacity: 0.6;
}

.community-card-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.community-tag {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 3px;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--white);
  background: var(--ash);
}
.community-tag.tag-notice { background: var(--ink-2); }
.community-tag.tag-blog   { background: #47616E; }
.community-tag.tag-event  { background: color-mix(in srgb, var(--brand-primary) 60%, var(--brand-accent)); }

.community-card-title {
  margin: 4px 0 0;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(20px, 1.6vw, 24px);
  line-height: 1.3;
  color: var(--ink-2);
  word-break: keep-all;
}
.community-card-title a { color: inherit; }
.community-card-title a:hover { color: color-mix(in srgb, var(--ink-2) 70%, var(--brand-accent)); }

.community-card-excerpt {
  margin: 2px 0 0;
  font-family: var(--serif);
  font-size: 15px;
  line-height: 1.65;
  color: var(--ash);
  word-break: keep-all;
}
.community-card-more {
  margin-left: 6px;
  font-family: var(--serif);
  font-style: italic;
  font-size: 14px;
  color: var(--ink-2);
  white-space: nowrap;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.community-card-more:hover { color: var(--brand-primary); }

.community-card-meta {
  margin-top: auto;
  padding-top: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
  font-family: var(--serif);
  font-size: 13px;
  letter-spacing: 0.03em;
  color: var(--ash);
}
.community-card-meta .meta-author { font-style: italic; color: var(--ink-2); }
.community-card-meta .meta-sep { color: var(--silver); }

/* 페이지네이션 */
.community-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  margin-top: 36px;
  font-family: var(--serif);
}
.community-pagination .page-num,
.community-pagination .page-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 3px;
  color: var(--ash);
  font-size: 15px;
  letter-spacing: 0.02em;
  transition: all 160ms ease;
}
.community-pagination .page-num:hover,
.community-pagination .page-arrow:not(.is-disabled):hover {
  color: var(--ink-2);
  border-color: var(--line-strong);
}
.community-pagination .page-num.is-active {
  background: var(--ink-2);
  border-color: var(--ink-2);
  color: var(--white);
  font-weight: 500;
}
.community-pagination .page-arrow.is-disabled {
  color: var(--silver);
  cursor: default;
}
.community-empty {
  padding: 60px 20px;
  text-align: center;
  font-family: var(--serif);
  font-style: italic;
  font-size: 17px;
  color: var(--ash);
}

/* 사이드바 */
.community-sidebar {
  display: flex;
  flex-direction: column;
  gap: 22px;
  position: sticky;
  top: 24px;
}
.sidebar-widget {
  padding: 20px 18px;
  background-color: #ffffff;
  background-image: var(--paper-grain), linear-gradient(180deg, #ffffff, #faf7f0);
  border: 1px solid var(--line);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.04);
}
.sidebar-title {
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
  font-family: var(--serif);
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--ink-2);
}
.sidebar-title .sidebar-sub {
  margin-left: 6px;
  font-style: italic;
  font-size: 13px;
  color: var(--ash);
  font-weight: 400;
}
.sidebar-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 14px;
}
.sidebar-item {
  display: grid;
  grid-template-columns: 60px 1fr;
  gap: 12px;
  align-items: center;
  color: inherit;
}
.sidebar-thumb {
  display: block;
  aspect-ratio: 1 / 1;
  background: var(--mist);
  border: 1px solid rgba(0, 0, 0, 0.06);
  overflow: hidden;
}
.sidebar-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sidebar-body { display: grid; gap: 4px; min-width: 0; }
.sidebar-item-title {
  font-family: var(--serif);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.4;
  color: var(--ink-2);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: keep-all;
}
.sidebar-item:hover .sidebar-item-title { color: color-mix(in srgb, var(--ink-2) 70%, var(--brand-accent)); }
.sidebar-item-date {
  font-family: var(--serif);
  font-style: italic;
  font-size: 12px;
  color: var(--ash);
  letter-spacing: 0.03em;
}
.sidebar-empty {
  margin: 0;
  font-family: var(--serif);
  font-style: italic;
  font-size: 13px;
  color: var(--ash);
}

@media (max-width: 980px) {
  /* 모바일/태블릿: Popular 위젯이 본문 위로 올라가도록 재배치
     - .community-sidebar 박스를 display:contents 로 해제 → 두 위젯이 .community-layout 직접 자식으로 승격
     - flex order: 1) Popular (사이드바 첫 위젯) → 2) 본문 → 3) 인기 글 */
  .community-layout {
    display: flex;
    flex-direction: column;
    gap: 30px;
  }
  .community-sidebar {
    display: contents;
    position: static;
  }
  .community-list { order: 2; }
  .community-sidebar > .sidebar-widget:first-child  { order: 1; } /* Popular */
  .community-sidebar > .sidebar-widget:nth-child(2) { order: 3; } /* 인기 글 (조회순) */
}
@media (max-width: 640px) {
  .community-filter { gap: 6px; margin-bottom: 28px; }
  .community-chip { padding: 6px 14px; font-size: 13px; }
  .community-card {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .community-card-thumb { max-width: 100%; }
  .community-card-title { font-size: 18px; }
  .community-card-excerpt { font-size: 14px; }
  .sidebar-widget { padding: 18px 16px; }
}

/* ============================================================
   COLOPHON
============================================================ */

.colophon {
  position: relative;
  padding: 110px var(--gutter) 56px;
  color: rgba(255, 255, 255, 0.78);
  background: var(--ink-2);
  text-align: center;
  overflow: hidden;
}

.colophon-stamp {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.colophon-stamp img {
  width: min(720px, 80%);
  opacity: 0.07;
  filter: invert(1) brightness(2.4) saturate(0);
  mix-blend-mode: screen;
}

.colophon > * { position: relative; z-index: 1; }

.colophon-top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
  padding-bottom: 40px;
  border-bottom: 1px dashed var(--line-light-dotted);
  text-align: left;
}
.colophon-logo { display: grid; gap: 4px; }
.colophon-logo .title-kr {
  font-family: var(--serif);
  font-weight: 500;
  font-size: 32px;
  color: var(--white);
  letter-spacing: 0.04em;
}
.colophon-logo .title-en {
  font-family: var(--script);
  font-size: 26px;
  color: var(--pearl);
}

.colophon-tag {
  margin: 0;
  text-align: right;
  color: var(--pearl);
  font-family: var(--serif);
  font-size: clamp(18px, 1.8vw, 24px);
  line-height: 1.55;
}
.colophon-tag em { font-style: italic; }

.colophon-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
  padding: 48px 0;
  border-bottom: 1px dashed var(--line-light-dotted);
  text-align: left;
}
.colophon-grid .label {
  display: block;
  margin: 0 0 14px;
  color: var(--silver);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.32em;
  text-transform: uppercase;
}
.colophon-grid p {
  margin: 4px 0;
  color: rgba(255, 255, 255, 0.78);
  font-family: var(--serif);
  font-size: 16px;
  line-height: 1.7;
}
.colophon-grid em { font-style: italic; color: var(--pearl); }

.colophon-bottom {
  display: flex;
  align-items: center;
  gap: 20px;
  padding-top: 28px;
  color: rgba(255, 255, 255, 0.55);
  font-family: var(--serif);
  font-size: 13px;
  letter-spacing: 0.04em;
}
.colophon-bottom .rule-long {
  flex: 1;
  height: 1px;
  background: var(--line-light);
}
.colophon-bottom em { font-style: italic; }
.colophon-link {
  color: rgba(255, 255, 255, 0.85);
  font-family: var(--serif);
  font-style: italic;
  letter-spacing: 0.04em;
  border-bottom: 1px solid rgba(255, 255, 255, 0.32);
  padding-bottom: 1px;
  transition: color 160ms ease, border-color 160ms ease;
}
.colophon-link:hover {
  color: var(--white);
  border-bottom-color: var(--white);
}
.colophon-grid p strong {
  color: var(--white);
  font-weight: 500;
  letter-spacing: 0.02em;
}
.colophon-grid p em {
  font-style: italic;
  color: var(--pearl);
}

/* ============================================================
   RESPONSIVE
============================================================ */

@media (max-width: 1080px) {
  /* Lift entire masthead above the drawer so hamburger stays clickable */
  .masthead { z-index: 60; }

  .masthead-row {
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 14px;
    padding-bottom: 18px;
  }
  .masthead-meta .meta-text { display: none; }
  .masthead-hamburger { display: inline-flex; }

  /* Hamburger → X transition when drawer is open */
  .masthead.is-open .masthead-hamburger span { background: transparent; }
  .masthead.is-open .masthead-hamburger span::before { top: 0; transform: rotate(45deg); }
  .masthead.is-open .masthead-hamburger span::after { top: 0; transform: rotate(-45deg); }
  .masthead-hamburger span,
  .masthead-hamburger span::before,
  .masthead-hamburger span::after { transition: transform 200ms ease, top 200ms ease, background 120ms ease; }

  /* Drawer */
  .masthead-nav {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(360px, 100%);
    margin: 0;
    padding: 100px 28px 40px;
    border-top: 0;
    background: var(--ink-2);
    overflow-y: auto;
    z-index: 50;
    transform: translateX(100%);
    transition: transform 280ms ease;
    -webkit-overflow-scrolling: touch;
  }
  .masthead.is-open .masthead-nav {
    transform: translateX(0);
    box-shadow: -24px 0 56px rgba(0, 0, 0, 0.45);
  }
  .masthead.is-open::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 40;
    cursor: pointer;
  }

  .masthead-nav .nav-list {
    flex-direction: column;
    gap: 0;
    font-size: 15px;
  }
  /* ============================================================
     모바일 메뉴 행 — 그리드 [좌측 여백 | 라벨(중앙) | 펼침 아이콘]
     1·2·3차가 모두 동일한 그리드를 써서, 위에서부터 라벨이 같은 축으로
     진짜 중앙정렬된다(좌우 여백 칸이 대칭 → 가운데 1fr 이 행의 정중앙).
     토글은 예전 position:absolute 대신 우측 칸에 배치. 글자 크기는 단계별 유지.
     ============================================================ */
  .masthead-nav { --nav-icon-col: 40px; }

  .masthead-nav .nav-list > li,
  .masthead-nav .sub-list > li {
    display: grid;
    grid-template-columns: var(--nav-icon-col) minmax(0, 1fr) var(--nav-icon-col);
    align-items: center;
  }
  .masthead-nav .nav-list > li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }

  /* 라벨 — 가운데 칸, 좌우 동일 패딩 + 중앙정렬 (글자 크기는 단계별 유지) */
  .masthead-nav .nav-list > li > a,
  .masthead-nav .sub-list > li > a {
    grid-column: 2;
    display: block;
    text-align: center;
    white-space: normal;
    font-style: normal;
  }
  .masthead-nav .nav-list > li > a { padding: 16px 6px; font-size: 16px; }
  .masthead-nav .sub-list > li > a { padding: 8px 6px; font-size: 14px; }
  .masthead-nav .sub-list .sub-list--deep > li > a {
    padding: 7px 6px;
    font-size: 13px;
    font-style: normal;
    color: rgba(255, 255, 255, 0.6);
  }

  /* 펼침 아이콘(+/−) — 우측 칸 (position:absolute → grid 배치로 전환) */
  .masthead-nav .nav-toggle {
    grid-column: 3;
    position: static;
    justify-self: stretch;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 44px;
    padding: 0;
    background: transparent;
    border: 0;
    color: rgba(255, 255, 255, 0.78);
    font-family: var(--serif);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
  }
  .masthead-nav .sub-list .nav-toggle { height: 36px; font-size: 18px; }

  /* 펼쳐지는 하위 목록 — 전체 폭(다음 줄) 차지. 데스크탑 드롭다운 스타일 리셋 */
  .masthead-nav .sub-list {
    grid-column: 1 / -1;
    position: static;
    transform: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    background: transparent;
    border: 0;
    box-shadow: none;
    margin: 0;
    padding: 0 0 10px;
    transition: none;
    display: none;
  }
  .masthead-nav .nav-item.is-expanded > .sub-list { display: block; }
  /* 3차 목록 — 데스크탑 .sub-list .sub-list--deep(0,3,0)의 margin-left:16px·border-left 를
     같은 명시도로 리셋(안 그러면 3차만 오른쪽으로 밀림) */
  .masthead-nav .sub-list .sub-list--deep {
    margin: 0;
    padding: 2px 0 6px;
    border: 0;
    min-width: 0;
  }

  /* 데스크탑 hover 규칙(transform: translateX(-50%))이 미디어쿼리 밖에 있어
     드로어까지 새던 것 무력화 — 마우스를 올려도 서브메뉴가 밀리지 않는다. */
  .masthead-nav .nav-list > li:hover > .sub-list,
  .masthead-nav .nav-list > li:focus-within > .sub-list,
  .masthead-nav:hover .nav-list > li > .sub-list,
  .masthead-nav:focus-within .nav-list > li > .sub-list {
    transform: none;
    transition: none;
  }

  .cover-frame { padding: 150px clamp(28px, 7vw, 80px) 100px; }

  .cover-credits { flex-direction: column; gap: 18px; }
  .cover-credits .cover-rule {
    width: 80px;
    height: 1px;
    background: rgba(255, 255, 255, 0.32);
  }

  .specimen-body.two-col,
  .specimen-body.split {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .manifesto-copy {
    padding-left: 0;
    border-left: 0;
    padding-top: 30px;
    border-top: 1px dashed rgba(255, 255, 255, 0.32);
  }

  .specimen-grid { grid-template-columns: 1fr; gap: 28px; }
  .specimen-card { grid-template-columns: 100px 1fr; padding: 28px; }

  .portfolio-grid { grid-template-columns: repeat(2, 1fr); }
  .portfolio-grid .offset { transform: none; }

  .colophon-top { grid-template-columns: 1fr; gap: 18px; }
  .colophon-tag { text-align: left; }
  .colophon-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  :root { --gutter: 22px; }

  .masthead { padding: 16px var(--gutter) 0; }
  .masthead-title .title-kr { font-size: 30px; }
  .masthead-ornament { width: 50px; height: 50px; }

  .cover { min-height: 100vh; }
  .cover-frame { padding: 130px 22px 90px; min-height: 100vh; }
  .cover-title .line { font-size: 56px; }
  .cover-script { font-size: 28px; }

  .display { font-size: 32px; }
  .display.xl { font-size: 50px; }

  .pullquote p { font-size: 32px; }
  .pullquote .quote-mark { font-size: 96px; top: -22px; left: -4px; }

  .specimen-card { grid-template-columns: 1fr; text-align: center; }
  .specimen-card::before { inset: 12px; }
  .card-icon { max-width: 140px; margin: 0 auto; }
  .card-no { position: static; display: block; margin-bottom: 10px; }

  .specimen-dl > div { grid-template-columns: 1fr; gap: 4px; }
  .specimen-dl dd { font-size: 17px; }
  .drop-cap { font-size: 17px; }
  .drop-cap::first-letter { font-size: 48px; }
  .doctor-intro p { font-size: 15.5px; line-height: 1.8; }
  .doctor-intro-lead { font-size: 20px !important; }
  .doctor-note p { font-size: 18px; }
  .doctor-note-mark { font-size: 72px; }

  .portfolio-grid { grid-template-columns: 1fr; gap: 18px; }

  .colophon-grid { grid-template-columns: 1fr; gap: 28px; }
  .colophon-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
  .colophon-bottom .rule-long { width: 100%; }

  .ornament-divider img { width: 160px; }
}

/* ============================================================
   MOBILE MASTHEAD — 고정 헤더 + 로고 좌측 + 타이틀 텍스트 숨김
   (≤ 640px)
============================================================ */
@media (max-width: 640px) {
  .masthead {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 10px 16px;
    /* 불투명 솔리드 배경 — backdrop-filter/blur 사용 시 새 containing block 이 생겨
       자식 드로어(.masthead-nav)의 position:fixed top/bottom 기준이 마스트헤드 박스로
       바뀌면서 드로어가 마스트헤드 높이로 잘림. */
    background: var(--brand-primary);
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.22);
    z-index: 70;
  }
  .masthead-row {
    grid-template-columns: auto 1fr auto;
    gap: 8px;
    padding-bottom: 0;
    align-items: center;
  }
  /* 왼쪽 메타("for body health" 부제) 숨김 — 그 자리에 로고를 배치 */
  .masthead-meta.left { display: none; }
  .masthead-title {
    grid-column: 1;
    justify-self: start;
    align-items: flex-start;
    flex-direction: row;
    gap: 0;
  }
  .masthead-title .title-kr-link,
  .masthead-title .title-kr {
    display: none;
  }
  .masthead-title .custom-logo-link {
    display: inline-block;
    line-height: 0;
  }
  .custom-logo,
  .masthead-ornament {
    width: 38px !important;
    height: 38px !important;
    max-width: 38px;
    max-height: 38px;
    margin: 0;
  }
  .masthead-actions {
    grid-column: 3;
    justify-self: end;
    gap: 8px;
  }
  .masthead-hamburger {
    width: 38px;
    height: 38px;
  }
  /* 드로어가 fixed 헤더에 가려지지 않도록 상단 패딩 확보 */
  .masthead-nav { padding-top: 80px; }

  /* 히어로가 전폭 밴드로 분리됨 → 상단 패딩 없음 */
  .feature.community { padding-top: 0; }
}

/* ============================================================
   HEADER MARQUEE — 단일 항목 순차 통과 (one-at-a-time pass)
   각 항목은 컨테이너 우측 밖에서 시작 → 좌측 밖으로 빠져나간 뒤
   JS 가 다음 항목을 같은 방식으로 통과시킨다. CSS 키프레임 X.
============================================================ */
.clinic-marquee {
	width: 100%;
	background: #33392a;
	color: #f1f3f7;
	overflow: hidden;
	/* 마스트헤드(z-index:10) 가 absolute/fixed 로 마키 영역을 덮어 클릭이 가로채지므로
	   마키를 위로 올려서 anchor 의 href 가 정상 동작하도록. */
	position: relative;
	z-index: 80;
	font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 13px;
	line-height: 1.4;
	height: 34px;
}

.clinic-marquee-track {
	position: relative;
	width: 100%;
	height: 100%;
}

.clinic-marquee-item {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	display: none;
	align-items: center;
	gap: 6px;
	padding: 0 18px;
	color: inherit;
	text-decoration: none;
	white-space: nowrap;
	will-change: transform;
}

.clinic-marquee-item.is-active {
	display: inline-flex;
}

.clinic-marquee-item:hover .clinic-marquee-title {
	text-decoration: underline;
	color: #ffd089;
}

.clinic-marquee-dot {
	color: #6b7280;
	font-size: 10px;
	opacity: 0.7;
}

.clinic-marquee-title {
	color: #f1f3f7;
}

@media (max-width: 768px) {
	.clinic-marquee {
		font-size: 12px;
		height: 30px;
	}
	.clinic-marquee-item {
		padding: 0 12px;
	}
}

/* ============================================================
   모바일에서 마키 + 고정 마스트헤드 겹침 방지
   - 마키를 fixed top:0 으로 띄우고 마스트헤드(fixed)를 그 아래(top: 30px)로 이동
   - 마키가 있을 때만(:has) 적용해 마키 없는 페이지에선 영향 없음
============================================================ */
@media (max-width: 640px) {
	body:has(.clinic-marquee) .clinic-marquee {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 80;
	}
	body:has(.clinic-marquee) .masthead {
		top: 30px;
	}
	/* 히어로가 전폭 밴드로 분리됨 → 마키 유무와 무관하게 상단 패딩 없음 */
	body:has(.clinic-marquee) .feature.community {
		padding-top: 0;
	}
}

/* ============================================================
   장비/시술 카드 + 단일 페이지
   - shortcode [clinic_equipment_cards] 가 임의 페이지 본문에 카드 그리드 출력
   - /equipment/{slug}/ single 페이지 hero + 본문 + 관련 시술 그리드
   skinbooster_post.html 의 .post-skinbooster-* 톤을 글로벌로 승격하되,
   카드/single 만 필요한 최소 범위. 본문에 풀 herbarium 페이지가 있을 때는
   페이지 자체 <style> 토큰이 우선 (.post-skinbooster 안쪽).
============================================================ */
.clinic-eq-cards,
.clinic-eq-single {
	--psb-paper:      #f5efe0;
	--psb-paper-soft: #ece4d2;
	--psb-paper-deep: #e4d9bf;
	--psb-ink:        #2c2a24;
	--psb-ink-soft:   #5a5448;
	--psb-ink-faint:  #8f8770;
	--psb-sage:       #6c7a55;
	--psb-sage-deep:  #4b5a3d;
	--psb-terracotta: #b06b48;
	--psb-rule:       #b5a986;
	--psb-max:        1080px;
	--psb-pad:        clamp(20px, 4vw, 56px);
	font-family: "Noto Serif KR", "Cormorant Garamond", serif;
	color: var(--psb-ink);
	word-break: keep-all;
}

/* ---- 카드 그리드 (shortcode 출력) ---- */
.clinic-eq-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(28px, 4vw, 56px);
	max-width: var(--psb-max);
	margin: 0 auto;
	padding: clamp(20px, 4vw, 40px) var(--psb-pad);
}
@media (max-width: 760px) {
	.clinic-eq-cards { grid-template-columns: 1fr; }
}
.clinic-eq-card {
	background: var(--psb-paper);
	border: 1px solid var(--psb-rule);
	padding: clamp(24px, 3vw, 36px);
	position: relative;
}
.clinic-eq-card .post-skinbooster-card-num {
	position: absolute;
	top: 18px;
	right: 22px;
	font-family: "Cardo", "Cormorant Garamond", serif;
	font-style: italic;
	color: var(--psb-ink-faint);
	font-size: 13px;
	letter-spacing: 0.25em;
}
.clinic-eq-card .post-skinbooster-card-image {
	aspect-ratio: 1 / 1;
	background: var(--psb-paper-soft);
	border: 1px solid var(--psb-rule);
	margin-bottom: 22px;
	overflow: hidden;
}
.clinic-eq-card .post-skinbooster-card-image img {
	width: 100%; height: 100%; object-fit: cover;
}
.clinic-eq-card .post-skinbooster-card-title {
	font-family: "Cormorant Garamond", serif;
	font-weight: 500;
	font-size: clamp(22px, 2.6vw, 28px);
	margin: 0 0 4px;
	line-height: 1.3;
	color: var(--psb-ink);
}
.clinic-eq-card .post-skinbooster-card-latin {
	font-family: "Cardo", "Cormorant Garamond", serif;
	font-style: italic;
	color: var(--psb-sage);
	font-size: 13px;
	letter-spacing: 0.18em;
	margin-bottom: 18px;
}
.clinic-eq-card ul {
	font-size: 14.5px;
	color: var(--psb-ink-soft);
	line-height: 1.85;
	padding-left: 18px;
	margin: 0;
}
.clinic-eq-card-link {
	color: inherit;
	text-decoration: none;
	display: block;
}
.clinic-eq-card-link:hover .post-skinbooster-card-title {
	color: var(--psb-sage-deep);
}

/* ---- single 페이지 hero ---- */
.clinic-eq-single {
	background: var(--psb-paper);
	line-height: 1.75;
}
.clinic-eq-hero { padding-bottom: clamp(50px, 8vw, 100px); }
.clinic-eq-hero-wrap {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: clamp(40px, 6vw, 80px);
	align-items: center;
}
@media (max-width: 860px) {
	.clinic-eq-hero-wrap { grid-template-columns: 1fr; }
}
.clinic-eq-hero-text { max-width: 540px; }
.clinic-eq-hero-text .post-skinbooster-eyebrow {
	text-align: left;
	font-family: "Cardo", "Cormorant Garamond", serif;
	font-style: italic;
	font-size: 14px;
	letter-spacing: 0.22em;
	color: var(--psb-sage);
	text-transform: uppercase;
	margin-bottom: 16px;
}
.clinic-eq-hero-text .post-skinbooster-hero-title {
	font-family: "Cormorant Garamond", serif;
	font-weight: 400;
	font-size: clamp(36px, 5vw, 56px);
	line-height: 1.2;
	margin: 0 0 20px;
	text-align: left;
	color: var(--psb-ink);
	letter-spacing: 0.01em;
}
.clinic-eq-hero-lede {
	font-size: 16px;
	line-height: 1.9;
	color: var(--psb-ink-soft);
	margin: 0;
}
.clinic-eq-hero-image img {
	border: 1px solid var(--psb-rule);
	background: var(--psb-paper-soft);
	display: block;
	max-width: 100%;
	height: auto;
}

/* single 본문은 콘솔에서 입력한 자유 HTML — wrapper 만 제공 */
.clinic-eq-body { background: var(--psb-paper); }

/* 원리 섹션 — 선택 입력. 값이 있을 때만 렌더 */
.clinic-eq-principle {
	background: var(--psb-paper);
	border-top: 1px solid var(--psb-rule);
	padding: clamp(56px, 8vw, 100px) var(--psb-pad);
}
.clinic-eq-principle-wrap {
	max-width: var(--psb-max);
	margin: 0 auto;
}
.clinic-eq-principle-wrap.has-image {
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	gap: clamp(36px, 6vw, 76px);
	align-items: center;
}
@media (max-width: 860px) {
	.clinic-eq-principle-wrap.has-image { grid-template-columns: 1fr; }
}
.clinic-eq-principle .post-skinbooster-eyebrow {
	font-family: "Cardo", "Cormorant Garamond", serif;
	font-style: italic;
	text-align: left;
	font-size: 13px;
	letter-spacing: 0.28em;
	color: var(--psb-sage);
	text-transform: uppercase;
	margin-bottom: 14px;
}
.clinic-eq-principle-title {
	font-family: "Cormorant Garamond", serif;
	font-weight: 400;
	font-size: clamp(28px, 4vw, 40px);
	text-align: left;
	color: var(--psb-ink);
	margin: 0 0 8px;
	line-height: 1.2;
}
.clinic-eq-principle-title em { font-style: italic; color: var(--psb-sage-deep); }
.clinic-eq-principle .post-skinbooster-rule {
	width: 60px;
	height: 1px;
	background: var(--psb-rule);
	margin: 14px 0 28px;
}
.clinic-eq-principle-body {
	font-size: 16px;
	line-height: 1.9;
	color: var(--psb-ink-soft);
}
.clinic-eq-principle-body > *:first-child { margin-top: 0; }
.clinic-eq-principle-body > *:last-child { margin-bottom: 0; }
.clinic-eq-principle-figure { margin: 0; }
.clinic-eq-principle-figure img {
	display: block;
	width: 100%;
	height: auto;
	border: 1px solid var(--psb-rule);
	background: var(--psb-paper-soft);
}

/* 자주 묻는 질문 섹션 — 선택 입력. 값이 있을 때만 렌더 */
.clinic-eq-faq {
	background: var(--psb-paper-soft);
	border-top: 1px solid var(--psb-rule);
	padding: clamp(56px, 8vw, 100px) var(--psb-pad);
}
.clinic-eq-faq .post-skinbooster-wrap {
	max-width: 820px;
	margin: 0 auto;
}
.clinic-eq-faq .post-skinbooster-eyebrow {
	font-family: "Cardo", "Cormorant Garamond", serif;
	font-style: italic;
	text-align: center;
	font-size: 13px;
	letter-spacing: 0.3em;
	color: var(--psb-sage);
	text-transform: uppercase;
	margin-bottom: 14px;
}
.clinic-eq-faq-title {
	font-family: "Cormorant Garamond", serif;
	font-weight: 400;
	font-size: clamp(28px, 4vw, 40px);
	text-align: center;
	color: var(--psb-ink);
	margin: 0 0 8px;
	line-height: 1.2;
}
.clinic-eq-faq-title em { font-style: italic; color: var(--psb-sage-deep); }
.clinic-eq-faq .post-skinbooster-rule {
	width: 60px;
	height: 1px;
	background: var(--psb-rule);
	margin: 14px auto 32px;
}
.clinic-eq-faq-body {
	font-size: 16px;
	line-height: 1.85;
	color: var(--psb-ink-soft);
}
.clinic-eq-faq-body > *:first-child { margin-top: 0; }
.clinic-eq-faq-body > *:last-child { margin-bottom: 0; }
/* <details>/<summary> 로 구성한 Q&A 를 위한 기본 톤 */
.clinic-eq-faq-body details {
	border-bottom: 1px solid var(--psb-rule);
	padding: 18px 0;
}
.clinic-eq-faq-body details:first-of-type { border-top: 1px solid var(--psb-rule); }
.clinic-eq-faq-body summary {
	cursor: pointer;
	list-style: none;
	font-family: "Cormorant Garamond", serif;
	font-size: 20px;
	color: var(--psb-ink);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.clinic-eq-faq-body summary::-webkit-details-marker { display: none; }
.clinic-eq-faq-body summary::after {
	content: "+";
	font-size: 22px;
	color: var(--psb-sage);
	transition: transform 0.2s ease;
}
.clinic-eq-faq-body details[open] summary::after { content: "–"; }
.clinic-eq-faq-body details > *:not(summary) { margin-top: 12px; }

/* 관련 시술 그리드 — 카드 톤 재사용 */
.clinic-eq-related .post-skinbooster-title {
	font-family: "Cormorant Garamond", serif;
	font-weight: 400;
	font-size: clamp(28px, 4vw, 38px);
	text-align: center;
	color: var(--psb-ink);
	margin: 0 0 8px;
}
.clinic-eq-related .post-skinbooster-title em {
	font-style: italic;
	color: var(--psb-sage-deep);
}
.clinic-eq-related .post-skinbooster-eyebrow {
	font-family: "Cardo", "Cormorant Garamond", serif;
	font-style: italic;
	text-align: center;
	font-size: 13px;
	letter-spacing: 0.32em;
	color: var(--psb-sage);
	text-transform: uppercase;
	margin-bottom: 14px;
}
.clinic-eq-related .post-skinbooster-rule {
	width: 60px;
	height: 1px;
	background: var(--psb-rule);
	margin: 14px auto 32px;
}
.clinic-eq-related {
	background: var(--psb-paper-soft);
	border-top: 1px solid var(--psb-rule);
	border-bottom: 1px solid var(--psb-rule);
	padding: clamp(60px, 9vw, 110px) var(--psb-pad);
}
.clinic-eq-related .post-skinbooster-wrap {
	max-width: var(--psb-max);
	margin: 0 auto;
}

/* ============================================================
   연동 장비 카러셀 — page.php 하단(푸터 위)
   콘솔 콘텐츠 편집기 › SEO 설정 › "연동 장비" 에서 선택한 장비를
   sample/장비연동.thml 의 Catalogus 캐러셀 톤으로 노출.
   정사각 썸네일 + 가로 스크롤 + prev/next. 자체 팔레트로 self-contained.
============================================================ */
/* linked-equipment section reuses .arc-eq-cards (render_linked_section) */

/* ============================================================
   칼럼(COLUMN) — 목록/상세 선택형 스타일
   community-template.php(목록) 와 single-blog.php(상세) 의 스타일 파셜.
   · classic 목록/상세는 위쪽 COMMUNITY / herbarium 규칙을 그대로 사용.
   · 아래는 magazine·grid·minimal(목록) 과 editorial·fullbleed·minimal(상세).
============================================================ */

/* 공용 카드 표면 (매거진/그리드 카드) */
.col-mag-feature,
.col-mag-card,
.col-grid-card {
  background-color: #ffffff;
  background-image: var(--paper-grain), linear-gradient(180deg, #ffffff, #faf7f0);
  border: 1px solid var(--line);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(255, 255, 255, 0.6) inset;
}

/* ---------- 목록: 매거진 ---------- */
.col-magazine { display: block; }
.col-mag-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: clamp(24px, 3vw, 44px);
  padding: clamp(20px, 2.2vw, 32px);
  margin-bottom: clamp(24px, 3vw, 40px);
  align-items: center;
}
.col-mag-feature-thumb {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--mist);
  border: 1px solid rgba(0, 0, 0, 0.06);
}
.col-mag-feature-thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 500ms ease;
}
.col-mag-feature-thumb:hover img { transform: scale(1.04); }
.col-mag-feature-body { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.col-mag-feature-title {
  margin: 4px 0 0;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(26px, 2.4vw, 38px);
  line-height: 1.22;
  color: var(--ink-2);
  word-break: keep-all;
}
.col-mag-feature-title a { color: inherit; }
.col-mag-feature-title a:hover { color: color-mix(in srgb, var(--ink-2) 70%, var(--brand-accent)); }
.col-mag-feature-excerpt {
  margin: 0;
  font-family: var(--serif);
  font-size: 16px;
  line-height: 1.7;
  color: var(--ash);
  word-break: keep-all;
}

.col-mag-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(20px, 2.4vw, 30px);
}
.col-mag-card { display: flex; flex-direction: column; overflow: hidden; }
.col-mag-card-thumb {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--mist);
}
.col-mag-card-thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 400ms ease;
}
.col-mag-card-thumb:hover img { transform: scale(1.04); }
.col-mag-card-body { display: flex; flex-direction: column; gap: 8px; padding: 16px clamp(16px, 1.6vw, 22px) 20px; }
.col-mag-card-title {
  margin: 2px 0 0;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(18px, 1.4vw, 21px);
  line-height: 1.3;
  color: var(--ink-2);
  word-break: keep-all;
}
.col-mag-card-title a { color: inherit; }
.col-mag-card-title a:hover { color: color-mix(in srgb, var(--ink-2) 70%, var(--brand-accent)); }
.col-mag-card-date {
  font-family: var(--serif);
  font-style: italic;
  font-size: 13px;
  color: var(--ash);
  letter-spacing: 0.03em;
}

/* ---------- 목록: 그리드 갤러리 ---------- */
.col-grid-track {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 2.4vw, 30px);
}
.col-grid-card { display: flex; flex-direction: column; overflow: hidden; }
.col-grid-card-thumb {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--mist);
}
.col-grid-card-thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 500ms ease;
}
.col-grid-card-thumb:hover img { transform: scale(1.05); }
.col-grid-card-thumb .community-tag { position: absolute; top: 12px; left: 12px; }
.col-grid-card-body { display: flex; flex-direction: column; gap: 8px; padding: 16px clamp(14px, 1.4vw, 20px) 20px; }
.col-grid-card-title {
  margin: 0;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(18px, 1.4vw, 22px);
  line-height: 1.3;
  color: var(--ink-2);
  word-break: keep-all;
}
.col-grid-card-title a { color: inherit; }
.col-grid-card-title a:hover { color: color-mix(in srgb, var(--ink-2) 70%, var(--brand-accent)); }

/* ---------- 목록: 미니멀 ---------- */
/* 텍스트 리스트와 상단 고정 히어로는 동일한 컬럼 폭을 공유해 좌우 끝을 맞춘다. */
.col-minimal { max-width: 1200px; margin: 0 auto; }
.col-min-list { list-style: none; margin: 0; padding: 0; }
.col-min-item { border-top: 1px solid var(--line); }
.col-min-item:last-child { border-bottom: 1px solid var(--line); }
.col-min-link {
  display: flex;
  align-items: center;
  gap: clamp(16px, 2.5vw, 30px);
  padding: clamp(22px, 2.6vw, 34px) 4px;
  color: inherit;
  transition: padding-left 220ms ease;
}
.col-min-link:hover { padding-left: 14px; }
.col-min-text { flex: 1 1 auto; min-width: 0; }
/* 우측 정사각(1:1) 썸네일 */
.col-min-thumb {
  flex: 0 0 auto;
  width: clamp(92px, 12vw, 132px);
  aspect-ratio: 1 / 1;
  margin: 0;
  overflow: hidden;
  border-radius: 12px;
  background: #f3f1ee;
  border: 1px solid var(--line);
}
.col-min-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 400ms ease;
}
.col-min-link:hover .col-min-thumb img { transform: scale(1.04); }
.col-min-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}
.col-min-tag {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 3px;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--white);
  background: var(--ash);
}
.col-min-tag.tag-notice { background: var(--ink-2); }
.col-min-tag.tag-blog   { background: #47616E; }
.col-min-tag.tag-event  { background: color-mix(in srgb, var(--brand-primary) 60%, var(--brand-accent)); }
.col-min-date {
  font-family: var(--serif);
  font-style: italic;
  font-size: 13px;
  color: var(--ash);
  letter-spacing: 0.03em;
}
.col-min-title {
  margin: 0;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.3;
  color: var(--ink-2);
  word-break: keep-all;
}
.col-min-link:hover .col-min-title { color: color-mix(in srgb, var(--ink-2) 70%, var(--brand-accent)); }
.col-min-excerpt {
  margin: 8px 0 0;
  font-family: var(--serif);
  font-size: 15px;
  line-height: 1.7;
  color: var(--ash);
  word-break: keep-all;
}

/* ---------- 목록: 미니멀 — 상단 고정(Popular 핀) 히어로 ---------- */
/* 콘솔에서 "고정"한 글을 목록 최상단에 좌(텍스트)·우(썸네일) 캐러셀로 노출.
   슬라이드가 2개 이상이면 좌우 화살표 + 도트로 넘긴다(JS: clinic-skin.js). */
.col-pin-hero {
  position: relative;
  margin: 0 auto clamp(36px, 4vw, 56px);
  overflow: hidden;
  background-color: #ffffff;
  background-image: var(--paper-grain), linear-gradient(180deg, #ffffff, #faf7f0);
  border: 1px solid var(--line);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(255, 255, 255, 0.6) inset;
}
.col-pin-track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.col-pin-track::-webkit-scrollbar { display: none; }
.col-pin-slide {
  flex: 0 0 100%;
  scroll-snap-align: start;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  align-items: stretch;
  min-width: 0;
}
.col-pin-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 13px;
  padding: clamp(28px, 3.4vw, 52px);
  min-width: 0;
}
.col-pin-tag { align-self: flex-start; }
.col-pin-title {
  margin: 2px 0 0;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(24px, 2.3vw, 36px);
  line-height: 1.24;
  color: var(--ink-2);
  word-break: keep-all;
}
.col-pin-title a { color: inherit; }
.col-pin-title a:hover { color: color-mix(in srgb, var(--ink-2) 70%, var(--brand-accent)); }
.col-pin-excerpt {
  margin: 0;
  font-family: var(--serif);
  font-size: 16px;
  line-height: 1.7;
  color: var(--ash);
  word-break: keep-all;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.col-pin-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  font-family: var(--serif);
  font-size: 13px;
  letter-spacing: 0.02em;
  color: var(--ash);
}
.col-pin-meta .col-pin-author { font-style: italic; color: var(--ink-2); }
.col-pin-meta .meta-sep { color: var(--silver); }
.col-pin-more {
  align-self: flex-start;
  margin-top: 4px;
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--ink-2);
}
.col-pin-more span { transition: transform 220ms ease; display: inline-block; }
.col-pin-more:hover { color: var(--brand-primary); }
.col-pin-more:hover span { transform: translateX(4px); }
.col-pin-thumb {
  position: relative;
  display: block;
  overflow: hidden;
  background: var(--mist);
  min-height: 260px;
}
.col-pin-thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 600ms ease;
}
.col-pin-thumb:hover img { transform: scale(1.04); }
.col-pin-thumb .community-card-thumb-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 44px;
  color: var(--silver);
}
/* 좌우 화살표 */
.col-pin-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.9);
  color: var(--ink-2);
  font-family: var(--serif);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  transition: background 180ms ease, box-shadow 180ms ease;
}
.col-pin-arrow:hover { background: #fff; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14); }
.col-pin-prev { left: 12px; }
.col-pin-next { right: 12px; }
/* 하단 도트 */
.col-pin-dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: clamp(14px, 1.6vw, 20px);
  z-index: 3;
  display: flex;
  justify-content: center;
  gap: 8px;
}
.col-pin-dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.55);
  cursor: pointer;
  transition: width 200ms ease, background 200ms ease;
}
.col-pin-dot.is-active {
  width: 22px;
  border-radius: 4px;
  background: var(--brand-primary);
}

/* ============================================================
   칼럼 상세 — 공용
============================================================ */
.col-single {
  max-width: var(--content-max);
  margin: 0 auto;
  padding: clamp(200px, 22vw, 280px) var(--gutter) var(--section-pad-y);
}
.col-eyebrow {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 3px;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--white);
  background: color-mix(in srgb, var(--brand-accent) 70%, var(--brand-primary));
}
.col-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
  font-family: var(--serif);
  font-size: 14px;
  letter-spacing: 0.03em;
  color: var(--ash);
}
.col-meta .col-meta-author { font-style: italic; color: var(--ink-2); }
.col-meta .meta-sep { color: var(--silver); }

/* 본문 기본 타이포 (일반 텍스트 글) — 관리자 raw HTML 글은 자체 스타일이 우선 */
.col-body {
  font-family: var(--serif);
  font-size: 17px;
  line-height: 1.9;
  color: var(--ink-3);
  word-break: keep-all;
}
.col-body > *:first-child { margin-top: 0; }
.col-body p { margin: 0 0 1.3em; }
.col-body h2 { font-size: clamp(24px, 2vw, 30px); font-weight: 500; margin: 1.8em 0 0.6em; color: var(--ink-2); }
.col-body h3 { font-size: clamp(20px, 1.6vw, 24px); font-weight: 500; margin: 1.5em 0 0.5em; color: var(--ink-2); }
.col-body img { max-width: 100%; height: auto; display: block; margin: 1.6em auto; }
.col-body a { color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; }
.col-body a:hover { color: var(--brand-primary); }
.col-body blockquote {
  margin: 1.6em 0;
  padding: 4px 0 4px 22px;
  border-left: 2px solid var(--brand-accent);
  font-style: italic;
  color: var(--ash);
}
.col-body ul, .col-body ol { margin: 0 0 1.3em; padding-left: 1.4em; }
.col-body li { margin: 0.35em 0; }

/* ---------- 상세: 에디토리얼 ---------- */
.col-editorial { max-width: 940px; }
.col-editorial-head { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.col-editorial-title {
  margin: 0;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(30px, 3.6vw, 52px);
  line-height: 1.18;
  color: var(--ink-2);
  word-break: keep-all;
}
.col-editorial .col-meta { justify-content: center; }
.col-editorial-cover {
  margin: clamp(30px, 4vw, 52px) 0 0;
  overflow: hidden;
  border: 1px solid var(--line);
}
.col-editorial-cover img { width: 100%; height: auto; display: block; }
.col-editorial-body { max-width: 720px; margin: clamp(34px, 4vw, 56px) auto 0; }

/* ---------- 상세: 풀블리드 ---------- */
.col-single.col-fullbleed {
  max-width: none;
  margin: 0;
  padding: 0 0 var(--section-pad-y);
}
.col-fullbleed-hero {
  position: relative;
  min-height: clamp(440px, 62vh, 680px);
  display: flex;
  align-items: flex-end;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: clamp(200px, 22vw, 280px) var(--gutter) clamp(40px, 6vw, 84px);
}
.col-fullbleed.no-cover .col-fullbleed-hero {
  background-image: linear-gradient(150deg, color-mix(in srgb, var(--brand-primary) 92%, black), var(--brand-primary));
}
.col-fullbleed-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.62) 0%, rgba(0, 0, 0, 0.22) 45%, rgba(0, 0, 0, 0.08) 100%);
  pointer-events: none;
}
.col-fullbleed-hero-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: var(--content-max);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
  color: #fff;
}
.col-fullbleed-title {
  margin: 0;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(30px, 4vw, 58px);
  line-height: 1.16;
  color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.35);
  word-break: keep-all;
}
.col-fullbleed-hero .col-meta { color: rgba(255, 255, 255, 0.86); }
.col-fullbleed-hero .col-meta .col-meta-author { color: #fff; }
.col-fullbleed-hero .col-meta .meta-sep { color: rgba(255, 255, 255, 0.6); }
.col-fullbleed-hero .col-eyebrow { background: rgba(255, 255, 255, 0.18); backdrop-filter: blur(2px); }
.col-fullbleed-body {
  max-width: 760px;
  margin: clamp(40px, 5vw, 68px) auto 0;
  padding: 0 var(--gutter);
}

/* ---------- 상세: 미니멀 ---------- */
.col-minimal-head {
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
}
.col-single.col-minimal .col-minimal-title {
  margin: 0;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(28px, 3.2vw, 46px);
  line-height: 1.2;
  color: var(--ink-2);
  word-break: keep-all;
}
.col-minimal-head .rule-thin { margin-top: 8px; }
.col-minimal-body { max-width: 720px; margin: clamp(30px, 3.5vw, 48px) auto 0; }

/* ============================================================
   칼럼 스타일 — 반응형
============================================================ */
@media (max-width: 980px) {
  .col-mag-feature { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  /* 고정 히어로: 썸네일을 위로, 텍스트를 아래로 세로 스택 */
  .col-pin-slide { grid-template-columns: 1fr; }
  .col-pin-slide { grid-template-areas: "thumb" "body"; }
  .col-pin-body { grid-area: body; }
  .col-pin-thumb { grid-area: thumb; aspect-ratio: 16 / 10; min-height: 0; }
  .col-pin-arrow { width: 34px; height: 34px; font-size: 19px; }
  .col-pin-prev { left: 8px; }
  .col-pin-next { right: 8px; }
}
@media (max-width: 860px) {
  .col-grid-track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .col-mag-grid { grid-template-columns: 1fr; }
  .col-grid-track { grid-template-columns: 1fr; }
  .col-body { font-size: 16px; }
}

/* =========================================================
   ARCHIVE (arc) — 전역 크롬: 헤더 · 모바일 드로어 · 푸터
   멜로우피부과 리브랜드 (medisync-08 "arc" 스타일 이식).
   신규 클래스(.arc-*)만 사용 — 기존 .masthead/.colophon 과 충돌 없음.
========================================================= */
.arc-nav, .arc-foot, .arc-drawer {
  --arc-ink:#221d1b; --arc-soft:#8d837c; --arc-line:#e2ded9;
  --arc-paper:#ffffff; --arc-mist:#f3f1ef; --arc-brand:#7a4b45;
  font-family:'DM Sans','Noto Sans KR','Pretendard',-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',sans-serif;
  letter-spacing:-.005em;
}

/* ── 상단바 ── */
.arc-nav{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.93);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--arc-line);transition:box-shadow .35s ease,background .35s ease}
.arc-nav.is-scrolled{background:rgba(255,255,255,.97);box-shadow:0 10px 34px rgba(34,29,27,.08)}
.arc-nav__in{width:min(1280px,calc(100% - 56px));margin:0 auto;display:flex;align-items:center;height:74px;gap:24px}
.arc-brand{display:inline-flex;align-items:center;text-decoration:none;flex:0 0 auto}
.arc-brand img{height:26px;width:auto;display:block;object-fit:contain}

/* ── 데스크톱 메뉴 (clinic_skin_render_menu 출력 재활용) ── */
.arc-nav__menu{margin-left:auto;display:flex}
.arc-nav__menu .nav-list{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:2px}
.arc-nav__menu .nav-list>.nav-item{position:relative;margin:0}
.arc-nav__menu .nav-list>.nav-item>a{display:inline-flex;align-items:center;gap:6px;
  padding:9px 14px;font-size:13px;font-weight:600;letter-spacing:.005em;color:var(--arc-ink);
  text-decoration:none;border-radius:9px;transition:color .18s,background .18s;white-space:nowrap}
.arc-nav__menu .nav-list>.nav-item.has-children>a::after{content:"";width:5px;height:5px;
  border-right:1.6px solid var(--arc-soft);border-bottom:1.6px solid var(--arc-soft);
  transform:rotate(45deg) translateY(-1px);transition:border-color .18s}
.arc-nav__menu .nav-list>.nav-item:hover>a{color:var(--arc-brand);background:var(--arc-mist)}
.arc-nav__menu .nav-list>.nav-item:hover>a::after{border-color:var(--arc-brand)}
.arc-nav__menu .sub-list{display:block;list-style:none;margin:0;padding:8px;position:absolute;top:calc(100% + 6px);left:0;
  min-width:210px;background:#fff;border:1px solid var(--arc-line);border-radius:12px;
  box-shadow:0 18px 44px rgba(34,29,27,.12);opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .2s,transform .2s,visibility .2s;z-index:10}
.arc-nav__menu .nav-item:hover>.sub-list{opacity:1;visibility:visible;transform:translateY(0)}
.arc-nav__menu .sub-list .nav-item{position:relative;margin:0}
.arc-nav__menu .sub-list a{display:block;padding:9px 12px;font-size:13px;color:#5d554f;
  text-decoration:none;border-radius:8px;transition:color .15s,background .15s;white-space:nowrap}
.arc-nav__menu .sub-list a:hover{color:var(--arc-brand);background:var(--arc-mist)}
.arc-nav__menu .sub-list--deep{top:-9px;left:calc(100% + 6px)}

/* ── 하위 메뉴 2구획(상위/하위 라벨 + 구분선) ── */
.arc-nav__menu .sub-list .sub-heading{display:block;padding:7px 12px 4px;font-size:10.5px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--arc-soft);white-space:nowrap;pointer-events:none;user-select:none}
.arc-nav__menu .sub-list .sub-heading--div{margin-top:6px;padding-top:11px;border-top:1px solid var(--arc-line)}
.arc-nav__menu .sub-list .sub-divider{list-style:none;height:0;margin:6px;border-top:1px solid var(--arc-line);pointer-events:none}

/* ── 햄버거 버튼 ── */
.arc-burger{display:none;flex:0 0 auto;margin-left:auto;width:44px;height:44px;padding:0;
  background:transparent;border:0;cursor:pointer;position:relative}
.arc-burger span{position:absolute;left:11px;right:11px;height:2px;background:var(--arc-ink);border-radius:2px;
  transition:transform .3s ease,opacity .2s ease}
.arc-burger span:nth-child(1){top:15px}
.arc-burger span:nth-child(2){top:21px}
.arc-burger span:nth-child(3){top:27px}
.arc-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.arc-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.arc-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ── 모바일 드로어 ── */
.arc-drawer{position:fixed;inset:0;z-index:1100;display:none}
.arc-drawer.is-open{display:block}
.arc-drawer__scrim{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;margin:0;cursor:pointer;
  background:rgba(34,29,27,.42);opacity:0;transition:opacity .3s ease}
.arc-drawer.is-open .arc-drawer__scrim{opacity:1}
.arc-drawer__panel{position:absolute;top:0;right:0;height:100%;width:min(86vw,360px);background:#fff;
  box-shadow:-14px 0 44px rgba(34,29,27,.16);transform:translateX(100%);
  transition:transform .34s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;
  overflow-y:auto;overscroll-behavior:contain}
.arc-drawer.is-open .arc-drawer__panel{transform:translateX(0)}
.arc-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;
  border-bottom:1px solid var(--arc-line);position:sticky;top:0;background:#fff;z-index:2}
.arc-drawer__logo{height:24px;width:auto}
.arc-drawer__close{width:40px;height:40px;font-size:30px;line-height:1;background:transparent;border:0;color:var(--arc-ink);cursor:pointer}
.arc-drawer__menu{padding:6px 0 48px}
.arc-drawer__menu .nav-list,.arc-drawer__menu .sub-list{list-style:none;margin:0;padding:0}
/* 하위 메뉴 2구획 — 드로어(모바일) */
.arc-drawer__menu .sub-list .sub-heading{display:block;padding:12px 22px 4px;font-size:10.5px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--arc-soft)}
.arc-drawer__menu .sub-list .sub-heading--div{border-top:1px solid #f0ece7;margin-top:2px;padding-top:12px}
.arc-drawer__menu .sub-list .sub-divider{list-style:none;height:0;margin:0;border-top:1px solid #f0ece7}
.arc-drawer__menu .nav-item{border-bottom:1px solid #f0ece7;margin:0}
.arc-drawer__menu .nav-depth-1{position:relative}
.arc-drawer__menu .nav-item>a{display:block;padding:14px 22px;font-size:15px;font-weight:600;color:var(--arc-ink);text-decoration:none}
.arc-drawer__menu .arc-acc{position:absolute;top:0;right:0;width:58px;height:50px;background:transparent;border:0;
  cursor:pointer;display:flex;align-items:center;justify-content:center}
.arc-drawer__menu .arc-acc::before{content:"";width:8px;height:8px;border-right:2px solid var(--arc-soft);
  border-bottom:2px solid var(--arc-soft);transform:rotate(45deg);transition:transform .25s ease}
.arc-drawer__menu .nav-depth-1.is-open>.arc-acc::before{transform:rotate(-135deg)}
.arc-drawer__menu .nav-depth-1>.sub-list{display:block;max-height:0;overflow:hidden;background:var(--arc-mist);transition:max-height .32s ease}
.arc-drawer__menu .nav-depth-1.is-open>.sub-list{max-height:1600px}
.arc-drawer__menu .sub-list .sub-list{max-height:none}
.arc-drawer__menu .sub-list a{padding:12px 22px 12px 34px;font-size:14px;font-weight:500;color:#5d554f}
.arc-drawer__menu .sub-list .sub-list a{padding-left:46px;font-size:13.5px}

/* ── 푸터 ── */
.arc-foot{background:var(--arc-mist);border-top:1px solid var(--arc-line);color:var(--arc-soft);font-size:14px}
.arc-foot__in{width:min(1280px,calc(100% - 56px));margin:0 auto;padding:56px 0 34px;display:grid;grid-template-columns:1.5fr 1fr;gap:44px}
.arc-foot__logo{height:24px;width:auto;margin:0 0 14px;display:block}
.arc-foot__brandtext{display:block;font-size:18px;font-weight:700;color:var(--arc-ink);margin:0 0 12px}
.arc-foot__tag{color:var(--arc-soft);font-size:14px;line-height:1.7;max-width:440px;margin:0}
.arc-foot__cols{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.arc-foot__col h4{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--arc-ink);margin:0 0 12px;font-weight:700}
.arc-foot__col p{margin:0 0 6px;line-height:1.7}
.arc-foot__col a{color:var(--arc-soft);text-decoration:none}
.arc-foot__col a:hover{color:var(--arc-brand)}
.arc-foot__bar{width:min(1280px,calc(100% - 56px));margin:0 auto;padding:18px 0 40px;border-top:1px solid var(--arc-line);
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 18px;font-size:12.5px}
.arc-foot__biz{display:inline-flex;flex-wrap:wrap;align-items:center}
.arc-foot__biz b{font-weight:700;color:var(--arc-ink)}
.arc-foot__biz span{position:relative;padding-left:13px;margin-left:13px}
.arc-foot__biz span::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:11px;background:var(--arc-line)}
.arc-foot__privacy{color:var(--arc-ink);font-weight:600;text-decoration:none}
.arc-foot__privacy:hover{color:var(--arc-brand)}

/* ── 반응형 ── */
@media(max-width:900px){
  .arc-nav__menu{display:none}
  .arc-burger{display:block}
  .arc-nav__in{width:calc(100% - 40px);height:64px;gap:12px}
  .arc-brand img{height:24px}
  .arc-foot__in{grid-template-columns:1fr;gap:30px;width:calc(100% - 40px);padding:44px 0 28px}
  .arc-foot__bar{width:calc(100% - 40px)}
}
@media(min-width:901px){ .arc-drawer{display:none !important} }
@media(max-width:520px){ .arc-foot__cols{grid-template-columns:1fr} }

/* 애니메이션 백스톱 — arc.js 가 2.5s 내 준비되지 않으면 리빌 요소를 강제 노출
   (JS 실패 시 .js .arc-reveal{opacity:0} 로 콘텐츠가 영영 숨는 것을 방지). */
.arc-anim-fallback .arc-reveal{opacity:1 !important;transform:none !important}
.arc-anim-fallback .arc-list li{opacity:1 !important;transform:none !important}

/* =========================================================
   ARC — 상담후기(case) 상세 · 목록 (single-clinic_case / archive / taxonomy)
========================================================= */
.arc-case,.arc-case-archive,.arc-case-related{
  --paper:#fff;--mist:#f3f1ef;--stone:#e2ded9;--ink:#221d1b;--soft:#8d837c;--brand:#7a4b45;--line:#e2ded9;
  font-family:'DM Sans','Noto Sans KR','Pretendard',-apple-system,BlinkMacSystemFont,sans-serif;
  color:var(--ink);letter-spacing:-.005em;line-height:1.7}
.arc-case *,.arc-case-archive *{box-sizing:border-box;min-width:0}
.arc-case__wrap{width:min(1040px,calc(100% - 48px));margin:0 auto}
.arc-case .arc-kicker,.arc-case-archive .arc-kicker,.arc-case-related .arc-kicker{
  font-size:10.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--soft);margin:0}

/* 상세 */
.arc-case{padding:34px 0 0}
.arc-case__crumb{font-size:12.5px;color:var(--soft);margin-bottom:28px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.arc-case__crumb a{color:var(--soft);text-decoration:none}
.arc-case__crumb a:hover{color:var(--brand)}
.arc-case__crumb .is-current{color:var(--ink)}
/* case 페이지는 흰 배경 */
body.single-clinic_case,body.post-type-archive-clinic_case,body.tax-clinic_concern{background:#fff}
/* 상세 2단 그리드 — 왼쪽(4)=텍스트, 오른쪽(6)=이미지(최대 3). 두 열 상단 정렬. */
/* 왼/오 열을 먼저 분리 — 텍스트(6)|이미지 컨테이너(4). 오른쪽 열 안에서 이미지는 gap 으로 촘촘히 쌓임. */
.arc-case2{display:grid;grid-template-columns:6fr 4fr;column-gap:44px;align-items:start;padding-bottom:8px}
.arc-case2--noimg{grid-template-columns:minmax(0,760px)}
.arc-case2__text{grid-column:1;display:flex;flex-direction:column;gap:26px;min-width:0}
.arc-case2__block{margin:0}
.arc-case2__imgs{grid-column:2;display:flex;flex-direction:column;gap:16px;min-width:0}
/* 이미지 — 원본 비율 그대로 전체 노출(자르지 않음), 실제 크기로 높이 반영 */
.arc-case2__img{margin:0;overflow:hidden;background:var(--mist)}
.arc-case2__img img{display:block;width:100%;height:auto}
/* 피부고민 태그 — facts 행(시술 위)에 노출 */
.arc-case__facts-concern{align-items:flex-start !important}
.arc-case__concerntags{display:inline-flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.arc-case__concerntags a{display:inline-block;padding:4px 11px;border-radius:999px;background:var(--mist);
  color:var(--brand);font-size:12px;font-weight:600;text-decoration:none;transition:background .15s}
.arc-case__concerntags a:hover{background:#ece6e2}
.arc-case__title{font-size:clamp(26px,3.4vw,38px);font-weight:600;line-height:1.28;letter-spacing:-.03em;margin:0 0 16px}
.arc-case__lede{font-size:16px;color:#5d554f;line-height:1.75;margin:0 0 22px}
.arc-case__facts{display:grid;gap:0;margin:0;max-width:360px}
.arc-case__facts>div{display:flex;justify-content:space-between;gap:16px;font-size:13.5px;padding:10px 0;border-bottom:1px solid var(--line)}
.arc-case__facts dt{color:var(--soft);margin:0}
.arc-case__facts dd{margin:0;font-weight:500;text-align:right}
.arc-case__facts{max-width:none}

/* 본문 (사용자 HTML) */
.arc-case__body{max-width:100%}
.arc-case__body>*+*{margin-top:1.1em}
.arc-case__body h2{font-size:1.5em;font-weight:600;margin-top:1.8em;letter-spacing:-.02em}
.arc-case__body h3{font-size:1.2em;font-weight:600;margin-top:1.5em}
.arc-case__body p{color:var(--ink);font-size:16px;line-height:1.85}
.arc-case__body a{color:var(--brand);text-underline-offset:3px}
.arc-case__body ul,.arc-case__body ol{padding-left:1.2em;display:grid;gap:.5em}
.arc-case__body img{max-width:100%;height:auto;border-radius:14px;display:block}
.arc-case__body blockquote{margin:0;padding:4px 0 4px 18px;border-left:3px solid var(--brand);color:var(--soft)}
.arc-case__body figure{margin:0}
.arc-case__body figcaption{font-size:13.5px;color:var(--soft);margin-top:8px}
.arc-case__disclaimer{max-width:100%;margin:0;padding:14px 16px;background:var(--mist);border-radius:10px;
  font-size:12.5px;color:var(--soft);line-height:1.6}

/* 연관 사례 */
.arc-case-related{margin-top:64px;padding:60px 0 72px;background:#fff;border-top:1px solid var(--line)}
.arc-case-related__h{font-size:clamp(20px,2.4vw,26px);font-weight:500;letter-spacing:-.02em;margin:8px 0 30px}
.arc-case-more{margin-top:26px}
.arc-case-morelink{color:var(--brand);font-weight:600;text-decoration:none;font-size:14px}
.arc-case-morelink:hover{text-decoration:underline}

/* 목록(아카이브) */
.arc-case-archive{padding:44px 0 80px}
.arc-case-archive__head{max-width:640px;margin-bottom:30px}
.arc-case-archive__head h1{font-size:clamp(26px,3.6vw,38px);font-weight:600;letter-spacing:-.03em;margin:10px 0 12px;line-height:1.24}
.arc-case-archive__tagword{color:var(--brand)}
.arc-case-archive__lede{font-size:15px;color:var(--soft);line-height:1.7;margin:0}
/* 피부고민 검색창 + 필터 버튼 바 */
.arc-case-filterbar{margin-bottom:34px}
.arc-case-searchrow{position:relative;max-width:460px;margin-bottom:14px}
.arc-case-search-ic{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:var(--soft);pointer-events:none;font-size:18px;width:18px;height:18px}
.arc-case-search{width:100%;padding:12px 18px 12px 42px;border:1px solid var(--line);border-radius:999px;font-size:14px;font-family:inherit;color:var(--ink);background:#fff;transition:border-color .15s,box-shadow .15s}
.arc-case-search::placeholder{color:#b7afa8}
.arc-case-search:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(122,75,69,.1)}
.arc-case-noresult{padding:52px 0;text-align:center;color:var(--soft);font-size:15px}
.arc-case-filter{display:flex;flex-wrap:wrap;gap:8px}
.arc-case-filter a{display:inline-block;padding:8px 15px;border-radius:999px;border:1px solid var(--line);
  background:#fff;color:#5d554f;font-size:13px;font-weight:500;text-decoration:none;transition:all .15s}
.arc-case-filter a:hover{border-color:var(--brand);color:var(--brand)}
.arc-case-filter a.is-active{background:var(--brand);border-color:var(--brand);color:#fff}

/* 카드 그리드 (연관·아카이브 공용) */
.arc-case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 26px}
.arc-case-card{display:block;text-decoration:none;color:inherit}
.arc-case-card__fig{margin:0;overflow:hidden;background:var(--stone)}
/* 썸네일 전체 노출 — 원본 비율 유지(자르지 않음) */
.arc-case-card__fig img{display:block;width:100%;height:auto;filter:saturate(.94);transition:transform .55s ease,filter .3s ease}
.arc-case-card:hover .arc-case-card__fig img{transform:scale(1.04);filter:saturate(1)}
.arc-case-card__tag{display:inline-block;margin:14px 0 0;font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--brand)}
.arc-case-card__title{font-size:16px;font-weight:600;line-height:1.45;letter-spacing:-.01em;margin:7px 0 0;color:var(--ink)}
.arc-case-card__lede{font-size:13px;line-height:1.6;color:var(--soft);margin:7px 0 0}
.arc-case-empty{grid-column:1/-1;padding:60px 0;text-align:center;color:var(--soft)}

/* 페이지네이션 */
.arc-case-archive .pagination,.arc-case-archive .nav-links{margin-top:44px;display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.arc-case-archive .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 10px;
  border:1px solid var(--line);border-radius:9px;color:#5d554f;text-decoration:none;font-size:14px}
.arc-case-archive .page-numbers.current{background:var(--brand);border-color:var(--brand);color:#fff}
.arc-case-archive .page-numbers:hover{border-color:var(--brand);color:var(--brand)}

@media(max-width:820px){
  /* 모바일: 첫 이미지(상단) → 텍스트(중간) → 나머지 이미지(하단).
     __imgs 감싸개를 display:contents 로 투명화해 이미지를 직접 자식으로 만들어 order 로 분산. */
  .arc-case2{display:flex;flex-direction:column;gap:24px}
  .arc-case2__imgs{display:contents}
  .arc-case2__text{order:2}
  .arc-case2__img{order:3}
  .arc-case2__img--lead{order:1}
  .arc-case-grid{grid-template-columns:repeat(2,1fr);gap:26px 18px}
}
@media(max-width:520px){
  .arc-case__wrap{width:calc(100% - 36px)}
  .arc-case-grid{grid-template-columns:1fr 1fr;gap:20px 14px}
  .arc-case-card__title{font-size:14px}
  .arc-case-card__lede{display:none}
}

/* =========================================================
   ARC — 메인페이지 베스트 상담후기 슬라이더 (무한 마퀴 + 좌우 그라데이션)
   노출 개수: 모바일 2 → 3 → 4 → 5 → ≥1600px 6
========================================================= */
.arc-bestcases{padding:72px 0 84px;background:var(--paper,#fff)}
.arc-bestcases .arc-in{margin-bottom:32px}
.arc-bestcases a{color:inherit}
.arc-cslider{--vis:2;--gap:14px;position:relative;width:100%;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)}
.arc-cslider__track{display:flex;gap:var(--gap);width:max-content;
  animation:arcCSlide var(--dur,52s) linear infinite;will-change:transform}
.arc-cslider:hover .arc-cslider__track,
.arc-cslider:focus-within .arc-cslider__track{animation-play-state:paused}
.arc-cslider__item{flex:0 0 calc(100vw / var(--vis) - var(--gap));max-width:400px;align-self:flex-start;
  text-decoration:none;color:inherit}
/* 메인페이지 이미지처럼 각진 모서리(radius 없음) */
.arc-cslider__fig{margin:0;overflow:hidden;background:var(--mist,#f3f1ef)}
.arc-cslider__fig img{display:block;width:100%;height:auto}
.arc-cslider__tag{display:inline-block;margin:13px 0 0;font-size:10.5px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brand,#7a4b45)}
.arc-cslider__title{margin:6px 0 0;font-size:15px;font-weight:600;line-height:1.45;letter-spacing:-.01em;color:var(--deep,#221d1b)}
@keyframes arcCSlide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(min-width:720px){.arc-cslider{--vis:3}}
@media(min-width:980px){.arc-cslider{--vis:4;--gap:18px}}
@media(min-width:1280px){.arc-cslider{--vis:5}}
@media(min-width:1600px){.arc-cslider{--vis:6}}
@media(prefers-reduced-motion:reduce){.arc-cslider__track{animation:none}}
@media(max-width:560px){.arc-bestcases{padding:52px 0 60px}}


/* =========================================================
   ARC — 장비(equipment) 상세 · 카드 · 장비소개 페이지
   single-clinic_equipment / [clinic_equipment_cards] / /장비-소개/
   메인(arc) 스타일 — 에디토리얼(post-skinbooster) 대체
========================================================= */
.arc-eq,.arc-eq-related,.arc-eq-cards,.arc-eqpage{
  --paper:#fff;--mist:#f3f1ef;--stone:#e2ded9;--ink:#221d1b;--soft:#8d837c;--brand:#7a4b45;--line:#e2ded9;
  font-family:'DM Sans','Noto Sans KR','Pretendard',-apple-system,BlinkMacSystemFont,sans-serif;
  color:var(--ink);letter-spacing:-.005em;line-height:1.7}
.arc-eq *,.arc-eqpage *{box-sizing:border-box;min-width:0}
body.single-clinic_equipment{background:#fff}

.arc-eq__wrap{width:min(1040px,calc(100% - 48px));margin:0 auto}
.arc-eq .arc-kicker,.arc-eq-related .arc-kicker,.arc-eqpage .arc-kicker{
  font-size:10.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--soft);margin:0}

.arc-eq{padding:34px 0 0}
.arc-eq__crumb{font-size:12.5px;color:var(--soft);margin-bottom:26px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.arc-eq__crumb a{color:var(--soft);text-decoration:none}
.arc-eq__crumb a:hover{color:var(--brand)}
.arc-eq__crumb .is-current{color:var(--ink)}

/* hero */
.arc-eq__hero{display:grid;grid-template-columns:1fr minmax(0,400px);gap:clamp(28px,5vw,56px);align-items:center;padding:4px 0 40px;border-bottom:1px solid var(--line)}
.arc-eq__hero--noimg{grid-template-columns:minmax(0,760px)}
.arc-eq__hero-text{min-width:0}
.arc-eq__latin{margin-bottom:14px}
.arc-eq__title{font-size:clamp(28px,3.6vw,42px);font-weight:600;line-height:1.24;letter-spacing:-.03em;margin:0}
.arc-eq__lede{font-size:16px;color:#5d554f;line-height:1.8;margin:16px 0 0}
.arc-eq__hero-fig{margin:0;background:var(--mist);border-radius:16px;overflow:hidden;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}
.arc-eq__hero-fig img{width:100%;height:100%;object-fit:cover}
@media(max-width:760px){.arc-eq__hero{grid-template-columns:1fr;gap:22px}.arc-eq__hero-fig{max-width:340px}}

/* sections */
.arc-eq__section{padding:40px 0;border-bottom:1px solid var(--line)}
.arc-eq__h2{font-size:clamp(20px,2.4vw,27px);font-weight:600;letter-spacing:-.025em;line-height:1.3;margin:10px 0 22px}

/* body-copy */
.arc-eq__body{max-width:100%}
.arc-eq__body>*+*{margin-top:1.05em}
.arc-eq__body p{color:var(--ink);font-size:16px;line-height:1.85;margin:0}
.arc-eq__body ul,.arc-eq__body ol{padding-left:1.2em;display:grid;gap:.5em;margin:0}
.arc-eq__body li{font-size:16px;line-height:1.7}
.arc-eq__body strong{font-weight:600}
.arc-eq__body a{color:var(--brand);text-underline-offset:3px}

/* 원리 — 이미지 있을 때 2단 */
.arc-eq__principle-grid.has-image{display:grid;grid-template-columns:1fr minmax(0,360px);gap:clamp(24px,4vw,48px);align-items:start}
@media(max-width:760px){.arc-eq__principle-grid.has-image{grid-template-columns:1fr}}
.arc-eq__principle-fig{margin:0;border-radius:14px;overflow:hidden;background:var(--mist)}
.arc-eq__principle-fig img{display:block;width:100%;height:auto}

/* FAQ 아코디언 */
.arc-eq__faqbody{max-width:100%}
.arc-eq__faqbody details{border-top:1px solid var(--line)}
.arc-eq__faqbody details:last-child{border-bottom:1px solid var(--line)}
.arc-eq__faqbody summary{cursor:pointer;list-style:none;padding:18px 44px 18px 0;position:relative;font-size:16px;font-weight:600;color:var(--ink);line-height:1.5}
.arc-eq__faqbody summary::-webkit-details-marker{display:none}
.arc-eq__faqbody summary::after{content:"";position:absolute;right:6px;top:50%;width:9px;height:9px;border-right:1.8px solid var(--soft);border-bottom:1.8px solid var(--soft);transform:translateY(-70%) rotate(45deg);transition:transform .25s}
.arc-eq__faqbody details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.arc-eq__faqbody details>div,.arc-eq__faqbody details>p{padding:0 0 20px;color:#5d554f;font-size:15px;line-height:1.8}
.arc-eq__faqbody details>div>*:first-child{margin-top:0}
.arc-eq__faqbody details>div>*+*{margin-top:.8em}

.arc-eq__disclaimer{font-size:12.5px;color:var(--soft);margin:26px 0 0;padding:0 0 48px}

/* 관련 장비 */
.arc-eq-related{margin-top:8px;padding:60px 0 72px;background:var(--mist)}
.arc-eq-related__h{font-size:clamp(20px,2.4vw,26px);font-weight:600;letter-spacing:-.02em;margin:8px 0 30px}
.arc-eq-related__h em{color:var(--brand);font-style:normal}
.arc-eq-related__sub{margin:-20px 0 30px;font-size:14px;line-height:1.7;color:var(--soft);max-width:640px}
.arc-eq-related .arc-eq-card__fig{background:#fff}

/* 카드 그리드 */
.arc-eq-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:34px 24px}
@media(max-width:900px){.arc-eq-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.arc-eq-cards{grid-template-columns:1fr}}

/* 콘텐츠 하단 연동 장비 섹션 — 데스크탑 3열 / 모바일 2열, 각지게, 톤 정리 */
.clinic-linked-eq .arc-eq-cards{grid-template-columns:repeat(3,1fr);gap:30px 24px}
.clinic-linked-eq .arc-eq-card__fig{border:1px solid var(--line)}
.clinic-linked-eq .arc-eq-card{transition:transform .3s ease}
.clinic-linked-eq .arc-eq-card:hover{transform:translateY(-3px)}
.clinic-linked-eq .arc-eq-card:hover .arc-eq-card__fig img{transform:none}
@media(max-width:900px){.clinic-linked-eq .arc-eq-cards{grid-template-columns:repeat(2,1fr)}}
.arc-eq-card{display:block;text-decoration:none;color:inherit}
.arc-eq-card__fig{margin:0;overflow:hidden;background:var(--mist);border-radius:0;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}
.arc-eq-card__fig img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.arc-eq-card:hover .arc-eq-card__fig img{transform:scale(1.05)}
.arc-eq-card__tag{display:inline-block;margin:14px 0 0;font-size:11px;font-weight:600;letter-spacing:.03em;color:var(--brand)}
.arc-eq-card__title{font-size:16px;font-weight:600;line-height:1.4;letter-spacing:-.01em;margin:6px 0 0;color:var(--ink)}
.arc-eq-card__lede{font-size:13px;line-height:1.6;color:var(--soft);margin:6px 0 0}

/* ============================================================
   콘텐츠 하단 "PROGRAM & PRICE" — 외부 SaaS(DermaPrice) 동기화 프로그램
   program_name 으로 묶은 그룹 테이블: 그룹명 → 설명 밴드 → 시술 행 + 옵션 컬럼
   render: Clinic_Console_Program::render_linked_section
============================================================ */
.arc-prog-related,.arc-prog-groups{
  --paper:#fff;--mist:#f3f1ef;--stone:#e2ded9;--ink:#221d1b;--soft:#8d837c;--brand:#7a4b45;--line:#e2ded9;
  font-family:'DM Sans','Noto Sans KR','Pretendard',-apple-system,BlinkMacSystemFont,sans-serif;color:var(--ink)}
.arc-prog-related *{box-sizing:border-box;min-width:0}
.arc-prog-related{padding:60px 0 72px;background:var(--paper);border-top:1px solid var(--line)}
.arc-prog__wrap{width:min(1040px,calc(100% - 48px));margin:0 auto}
.arc-prog-related .arc-kicker{font-size:10.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--soft);margin:0}
.arc-prog-related__h{font-size:clamp(20px,2.4vw,26px);font-weight:600;letter-spacing:-.02em;margin:8px 0 12px;line-height:1.3}
.arc-prog-related__h em{color:var(--brand);font-style:normal}
.arc-prog-related__sub{margin:0 0 30px;font-size:14px;line-height:1.7;color:var(--soft);max-width:640px}
.arc-prog-related__foot{margin:26px 0 0;font-size:12.5px;color:var(--soft);line-height:1.6}

.arc-prog-groups{display:grid;gap:26px}
.arc-prog-group{background:var(--paper);border:1px solid var(--line)}
.arc-prog-group__name{font-size:clamp(17px,2vw,20px);font-weight:700;color:var(--ink);letter-spacing:-.01em;margin:0;padding:20px 24px 14px}
.arc-prog-group__intro{margin:0;padding:12px 24px;background:color-mix(in srgb,var(--brand) 7%,#faf7f6);color:#6f635e;font-size:13.5px;line-height:1.6;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.arc-prog-tablewrap{padding:4px 24px 12px;overflow-x:auto}
.arc-prog-table{width:100%;border-collapse:collapse}
.arc-prog-row{border-bottom:1px solid var(--line)}
.arc-prog-table tr:last-child{border-bottom:0}
.arc-prog-row__label{text-align:left;font-weight:500;color:var(--ink);font-size:14.5px;line-height:1.5;padding:16px 16px 16px 0;vertical-align:middle}
.arc-prog-row__badge{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:.06em;color:#fff;background:var(--brand);padding:2px 6px;margin-left:6px;vertical-align:middle}
.arc-prog-opt{text-align:right;vertical-align:middle;white-space:nowrap;width:1%;padding:12px 0 12px 26px}
.arc-prog-opt.is-empty{padding:0}
.arc-prog-opt__name{display:block;font-size:11.5px;color:var(--soft);margin-bottom:3px;font-weight:500}
.arc-prog-opt__price{display:block;font-size:15.5px;line-height:1.2}
.arc-prog-opt__was{font-size:12px;color:var(--soft);font-weight:400;text-decoration:line-through;margin-right:6px}
.arc-prog-opt__now{font-size:15.5px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.arc-prog-opt__ask{font-size:13px;color:var(--soft);font-weight:600}
@media(max-width:560px){
  .arc-prog-group__name,.arc-prog-group__intro,.arc-prog-tablewrap{padding-left:16px;padding-right:16px}
  .arc-prog-row__label{font-size:13.5px;padding-right:10px}
  .arc-prog-opt{padding-left:16px}
  .arc-prog-opt__now{font-size:14.5px}
}

/* 장비-소개 페이지 */
.arc-eqpage{background:#fff;padding:40px 0 24px}
.arc-eqpage__hero{width:min(1040px,calc(100% - 48px));margin:0 auto;padding:10px 0 6px}
.arc-eqpage__title{font-size:clamp(30px,4vw,46px);font-weight:600;letter-spacing:-.03em;line-height:1.2;margin:14px 0 0}
.arc-eqpage__lede{font-size:16px;color:#5d554f;line-height:1.85;margin:18px 0 0;max-width:720px}
.arc-eqpage__group{width:min(1040px,calc(100% - 48px));margin:0 auto;padding:46px 0}
.arc-eqpage__group+.arc-eqpage__group{border-top:1px solid var(--line)}
.arc-eqpage__group-h{font-size:clamp(22px,2.6vw,30px);font-weight:600;letter-spacing:-.025em;margin:10px 0 6px}
.arc-eqpage__group-lede{font-size:15px;color:#5d554f;line-height:1.75;margin:0 0 28px;max-width:640px}

/* 기대되는 효과 — 체크리스트 그리드 */
.arc-eq__effects-body ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px 20px}
@media(max-width:640px){.arc-eq__effects-body ul{grid-template-columns:1fr}}
.arc-eq__effects-body li{position:relative;padding:15px 18px 15px 44px;background:var(--mist);border-radius:12px;font-size:15px;line-height:1.6;color:var(--ink)}
.arc-eq__effects-body li::before{content:"";position:absolute;left:18px;top:50%;width:8px;height:13px;border-right:2.2px solid var(--brand);border-bottom:2.2px solid var(--brand);transform:translateY(-60%) rotate(45deg)}
.arc-eq__effects-body p{color:var(--ink);font-size:16px;line-height:1.85;margin:0}
.arc-eq__effects-body>*+*{margin-top:1em}

/* 효과·원리 — 왼쪽 이미지 + 오른쪽 내용 2단 (모바일: 이미지 위) */
.arc-eq__media-grid.has-image{display:grid;grid-template-columns:minmax(0,360px) 1fr;gap:clamp(22px,4vw,48px);align-items:start}
@media(max-width:760px){.arc-eq__media-grid.has-image{grid-template-columns:1fr}}
.arc-eq__media-fig{margin:0;border-radius:14px;overflow:hidden;background:var(--mist)}
.arc-eq__media-fig img{display:block;width:100%;height:auto}
/* 이미지가 있으면 효과 체크리스트는 1열(우측 좁은 폭) */
.arc-eq__media-grid.has-image .arc-eq__effects-body ul{grid-template-columns:1fr}

/* ============================================================
   칼럼(Column) 피드/상세 — 톤(스킨) 시스템 (v1.7.6)
   ────────────────────────────────────────────────────────────
   콘솔 › 스타일 › "톤" 선택 → <body> 에 .pcol-skin-{arc|herbarium}.
   구조(pcol-list-*/pcol-single-*)와 직교: 레이아웃은 그대로 두고 톤만 교체.
     · herbarium = 테마 기본(크림 배경 · 세리프 표본저널 톤) — 아래 규칙 미적용
     · arc       = 메인/상담후기 톤(흰 배경 · 산세리프 · --arc-brand)
============================================================ */

/* 톤 무관 레이아웃 보정 — 히어로가 전폭 밴드로 분리됨. 히어로 padding-bottom 이
   h1↔필터칩 간격을 담당하므로 섹션 상단 패딩은 0 (상담후기 .arc-case-archive 와 동일). */
body[class*="pcol-list-"] .feature.community {
  padding-top: 0;
}

/* 활동 태그(대외활동 등) 아웃라인 배지 — 톤 무관 */
.col-min-tag--activity,
.community-tag--activity {
  background: #fff;
  color: var(--arc-brand, #7a4b45);
  border: 1px solid var(--arc-brand, #7a4b45);
}

/* ─────────────────────────── 아크(arc) 톤 ─────────────────────────── */

/* 1) 배경 순백 — 누런 크림/그라디언트/그레인 제거 */
body.pcol-skin-arc { background: #fff; }

/* 2) 칼럼 영역 토큰 리매핑 — 세리프→sans, herbarium 색/선 → arc.
   (.feature = 피드 + 클래식 상세 래퍼, .col-single = 에디토리얼/풀블리드/미니멀 상세)
   → 표제·발췌·날짜·필터의 폰트/색/보더가 한 번에 arc 로 전환된다. */
body.pcol-skin-arc .feature,
body.pcol-skin-arc .col-single {
  --serif:       var(--sans);
  --ink-2:       var(--arc-ink, #221d1b);
  --ink-3:       var(--arc-ink, #221d1b);
  --ash:         #6b615c;
  --ash-2:       #8a8178;
  --silver:      #b8b2aa;
  --line:        var(--arc-line, #e2ded9);
  --line-strong: var(--arc-line, #e2ded9);
}

/* 3) 필터 칩 — 세리프 이탤릭 → sans 필, active = arc 브랜드 */
body.pcol-skin-arc .community-chip { font-style: normal; }
body.pcol-skin-arc .community-chip.is-active {
  background: var(--arc-brand, #7a4b45);
  border-color: var(--arc-brand, #7a4b45);
  color: #fff;
}

/* 4) 카테고리 태그 → arc 브랜드 (herbarium 블루그레이 제거) */
body.pcol-skin-arc .community-tag.tag-blog,
body.pcol-skin-arc .col-min-tag.tag-blog,
body.pcol-skin-arc .col-pin-tag.tag-blog { background: var(--arc-brand, #7a4b45); }

/* 5) 카드 — 크림 그라디언트/그레인 제거 → 순백 + arc 보더 */
body.pcol-skin-arc .community-card,
body.pcol-skin-arc .col-pin-hero {
  background: #fff;
  background-image: none;
  border-color: var(--arc-line, #e2ded9);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
}
body.pcol-skin-arc .community-card-thumb,
body.pcol-skin-arc .col-pin-thumb { background: #f3f1ee; }

/* 6) 피드 표제(칼럼 / Column) — 굵은 sans, 서브타이틀 arc 브랜드 */
body.pcol-skin-arc .community .specimen-header .display { font-weight: 800; letter-spacing: -0.02em; }
body.pcol-skin-arc .community .specimen-header .latin { color: var(--arc-brand, #7a4b45); font-style: normal; }

/* ============================================================
   /community(칼럼) 리뉴얼 — 레이어드 리프팅(page 353) 톤 매칭 (v1.7.8)
   ────────────────────────────────────────────────────────────
   DM Sans · 웜뉴트럴 팔레트 · 각진 모서리(border-radius:0) ·
   중앙 히어로 · 각진 흰 칩(브랜드 점). 스킨과 무관하게 이 톤 고정.
============================================================ */
.feature.community {
  --cm-ink:   #221d1b;
  --cm-body:  #5f574f;
  --cm-brand: #7a4b45;
  --cm-line:  rgba(34, 29, 27, 0.11);
  --cm-soft:  #faf7f3;
  font-family: 'DM Sans', 'Noto Sans KR', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', sans-serif;
}

/* ── 히어로 (전폭 그라디언트 밴드) — /map/ 히어로 스타일 공통
   공지/이벤트/칼럼(cmty-hero) + 상담후기(arc-case-hero) h1 헤더에 동일 적용 ── */
.cmty-hero,
.arc-case-hero {
  background: linear-gradient(180deg, #fbf8f4, #fff);
  text-align: center;
  padding: clamp(58px, 8vw, 116px) 0 clamp(44px, 6vw, 72px);
  font-family: 'DM Sans', 'Noto Sans KR', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', sans-serif;
}
.cmty-hero__in,
.arc-case-hero__in { width: min(1040px, calc(100% - 44px)); margin: 0 auto; }
.cmty-hero__k,
.arc-case-hero__k {
  margin: 0;
  color: #7a4b45;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}
.cmty-hero__title,
.arc-case-hero__title {
  margin: 18px 0 0;
  font-family: inherit;
  font-size: clamp(28px, 4.4vw, 50px);
  font-weight: 600;
  letter-spacing: -0.035em;
  line-height: 1.22;
  color: #221d1b;
  word-break: keep-all;
}
.arc-case-hero__title .arc-case-archive__tagword { color: #7a4b45; }
.cmty-hero__lede,
.arc-case-hero__lede {
  margin: 20px auto 0;
  max-width: 560px;
  font-size: clamp(14px, 1.5vw, 17px);
  line-height: 1.8;
  color: #5f574f;
  word-break: keep-all;
}
/* 케이스 아카이브 — 히어로 밴드가 nav 아래 바로 닿도록 섹션 상단 패딩 제거 */
.arc-case-archive { padding-top: 0; }

/* ── 필터 칩 — 각진 흰 칩 + 브랜드 점 ── */
.feature.community .community-filter { gap: 10px; margin: 0 0 clamp(30px, 4vw, 48px); }
.feature.community .community-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: inherit;
  font-style: normal;
  font-size: 13px;
  font-weight: 500;
  padding: 10px 18px;
  border-radius: 0;
  border: 1px solid var(--cm-line);
  background: #fff;
  color: var(--cm-ink);
  box-shadow: 0 1px 2px rgba(34, 29, 27, 0.03);
}
.feature.community .community-chip::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 0;
  background: var(--cm-brand);
  opacity: 0.35;
  transition: opacity 0.18s ease;
}
.feature.community .community-chip:hover { border-color: var(--cm-brand); }
.feature.community .community-chip.is-active { background: var(--cm-brand); border-color: var(--cm-brand); color: #fff; }
.feature.community .community-chip.is-active::before { background: #fff; opacity: 1; }

/* ── 목록(미니멀) — DM Sans · 각진 · 얇은 선 ── */
.feature.community .col-min-item,
.feature.community .col-min-item:last-child { border-color: var(--cm-line); }
.feature.community .col-min-title { font-family: inherit; font-weight: 600; letter-spacing: -0.02em; color: var(--cm-ink); }
.feature.community .col-min-excerpt { font-family: inherit; color: var(--cm-body); }
.feature.community .col-min-date { font-family: inherit; font-style: normal; color: #8a8178; }
.feature.community .col-min-thumb { border-radius: 0; border: 1px solid var(--cm-line); }

/* ── 모든 모서리 각지게(radius 제거) · 태그도 DM Sans ── */
.feature.community .col-min-tag,
.feature.community .col-min-tag--activity,
.feature.community .community-tag,
.feature.community .community-card,
.feature.community .community-card-thumb,
.feature.community .col-pin-hero,
.feature.community .col-pin-thumb,
.feature.community .community-pagination .page-num,
.feature.community .community-pagination .page-arrow { border-radius: 0; }
.feature.community .col-min-tag { font-family: inherit; }
.feature.community .col-min-tag.tag-blog,
.feature.community .community-tag.tag-blog { background: var(--cm-brand); }
.feature.community .col-min-tag--activity { color: var(--cm-brand); border-color: var(--cm-brand); }

/* ============================================================
   /case(상담후기) — community/353 톤 매칭 (v1.7.9)
   ────────────────────────────────────────────────────────────
   팔레트는 이미 웜 arc(--ink #221d1b · --brand #7a4b45)로 일치.
   → 폰트를 DM Sans 로 통일하고 모든 모서리를 각지게(border-radius:0).
============================================================ */
.arc-case-archive,
.arc-case {
  font-family: 'DM Sans', 'Noto Sans KR', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', sans-serif;
}

/* 모든 모서리 각지게 — 검색창·필터칩·페이지네이션·카드·이미지·태그·박스 */
.arc-case-search,
.arc-case-filter a,
.arc-case-archive .page-numbers,
.arc-case-card__fig,
.arc-case2__img,
.arc-case__body img,
.arc-case__disclaimer,
.arc-case__concerntags a { border-radius: 0; }
