/*
Theme Name: Hello Elementor Child — Medireturn
Theme URI: https://blog.medireturn.com
Description: Medireturn 블로그용 자식 테마. 토스(Toss) 디자인 시스템 기반, 공식몰(skin49) 디자인 언어 정합.
Author: Speedmover
Template: hello-elementor
Version: 0.4.0
Text Domain: hello-elementor-child
*/

/* ============================================================
   1. 디자인 토큰 — Toss Palette
   ============================================================ */
:root {
  /* Blue */
  --md-blue-heavy:   #1B64DA;  /* 묵직한 블루 */
  --md-blue:         #0064FF;  /* 메인, 강력 버튼 */
  --md-link:         #3182F6;  /* 텍스트 링크, 일반 강조 */
  --md-blue-soft:    #E8F3FF;  /* 블루 텍스트 배경 */

  /* Ink / Gray */
  --md-ink-900:      #191F28;  /* 가장 진한 텍스트 (제목/본문) */
  --md-ink-800:      #333D4B;  /* 서브 타이틀 */
  --md-ink-700:      #4E5968;  /* 설명 / 부연 */
  --md-ink-500:      #6B7684;  /* 비활성 / 플레이스홀더 */
  --md-ink-300:      #B0B8C1;
  --md-ink-200:      #D1D6DB;
  --md-ink-100:      #E5E8EB;  /* Divider */
  --md-ink-50:       #F2F4F6;  /* 섹션 배경 / 입력창 */
  --md-bg:           #FFFFFF;
  --md-surface:      #FFFFFF;

  /* Red */
  --md-red-bg:       #FEEEEE;
  --md-red-soft:     #F4606C;
  --md-red:          #F04452;
  --md-red-pressed:  #D33644;

  /* Highlight — 토스피드 본문 하이라이트(연청록). 파랑은 링크와 충돌해서 금지 */
  --md-hl-mint:      #DCF4EC;

  /* Semantic alias (이전 작업과 호환) */
  --md-brand:        var(--md-blue);
  --md-brand-hover:  var(--md-blue-heavy);
  --md-brand-soft:   var(--md-blue-soft);
  --md-error:        var(--md-red);

  /* Typography */
  --md-font-sans:    "Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", system-ui, sans-serif;

  --md-fs-display:   clamp(34px, 4.5vw, 48px);
  --md-fs-h1:        clamp(28px, 3.6vw, 40px);
  --md-fs-h2:        clamp(22px, 2.6vw, 30px);
  --md-fs-h3:        clamp(19px, 2vw, 24px);
  --md-fs-h4:        18px;
  --md-fs-h5:        16px;
  --md-fs-h6:        14px;
  --md-fs-lede:      18px;
  --md-fs-body:      16px;
  --md-fs-sm:        14px;
  --md-fs-xs:        13px;
  --md-fs-xxs:       12px;

  --md-lh-tight:     1.3;
  --md-lh-snug:      1.45;
  --md-lh-body:      1.7;
  /* 자간 — 공식몰 skin50 값 그대로 (전역·타이틀 -1px / UI 컴포넌트 -0.2px) */
  --md-ls-display:   -1px;
  --md-ls-tight:     -0.2px;
  --md-ls-normal:    -0.2px;

  /* Spacing — 8px 그리드 */
  --md-space-1:      4px;
  --md-space-2:      8px;
  --md-space-3:      12px;
  --md-space-4:      16px;
  --md-space-5:      20px;
  --md-space-6:      24px;
  --md-space-8:      32px;
  --md-space-10:     40px;
  --md-space-12:     48px;
  --md-space-14:     56px;
  --md-space-16:     64px;
  --md-space-20:     80px;
  --md-space-24:     96px;
  --md-space-32:     128px;

  /* Radius */
  --md-radius-xs:    6px;
  --md-radius-sm:    8px;
  --md-radius-md:    12px;
  --md-radius-lg:    16px;
  --md-radius-xl:    20px;
  --md-radius-pill:  999px;

  /* Elevation */
  --md-shadow-1:     0 1px 2px rgba(25,31,40,.06);
  --md-shadow-2:     0 4px 14px rgba(25,31,40,.10);
  --md-shadow-3:     0 8px 28px rgba(25,31,40,.14);
  --md-shadow-blue:  0 6px 20px rgba(0,100,255,.18);

  /* Motion — 토스 빠른 반응 */
  --md-ease:         cubic-bezier(.2, .8, .2, 1);
  --md-dur-fast:     120ms;
  --md-dur:          180ms;
  --md-dur-slow:     280ms;

  /* Layout */
  --md-container:    1200px;
  --md-content:      720px;
}

/* ============================================================
   2. Base — Reset 미세 보정 + 본문 가독성
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

:root { color-scheme: light; }   /* 모바일 강제 다크모드의 색 재계산(회색 배경화) 방지 */
body {
  font-family: var(--md-font-sans);
  font-size: var(--md-fs-body);
  line-height: var(--md-lh-body);
  letter-spacing: -1px;               /* 몰 reset과 동일한 전역 기본 자간 */
  color: var(--md-ink-900);
  background: var(--md-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  word-break: keep-all;     /* 한글 줄바꿈 자연스럽게 */
  overflow-wrap: anywhere;
}

::selection { background: var(--md-blue-soft); color: var(--md-ink-900); }

/* 스크롤바 (선택적 — 데스크탑 Chromium) */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--md-ink-100); border-radius: var(--md-radius-pill); }
::-webkit-scrollbar-thumb:hover { background: var(--md-ink-200); }

/* ============================================================
   3. Typography — 위계 / 본문
   ============================================================ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--md-font-sans);
  color: var(--md-ink-900);
  line-height: var(--md-lh-tight);
  letter-spacing: var(--md-ls-display);
  margin: 0 0 var(--md-space-4);
  font-weight: 700;
}

h1 { font-size: var(--md-fs-h1); font-weight: 800; }
h2 { font-size: var(--md-fs-h2); font-weight: 700; }
h3 { font-size: var(--md-fs-h3); font-weight: 700; color: var(--md-ink-800); }
h4 { font-size: var(--md-fs-h4); font-weight: 600; color: var(--md-ink-800); letter-spacing: var(--md-ls-tight); }
h5 { font-size: var(--md-fs-h5); font-weight: 600; color: var(--md-ink-800); letter-spacing: var(--md-ls-tight); }
h6 { font-size: var(--md-fs-h6); font-weight: 600; color: var(--md-ink-500); letter-spacing: 0.02em; text-transform: uppercase; }

p {
  margin: 0 0 var(--md-space-4);
  color: var(--md-ink-700);
}

.entry-content p { color: var(--md-ink-800); }
.entry-content > p:first-of-type {
  font-size: var(--md-fs-lede);
  line-height: var(--md-lh-snug);
  color: var(--md-ink-800);
}

small, .text-sm { font-size: var(--md-fs-sm); color: var(--md-ink-500); }
strong, b { color: var(--md-ink-900); font-weight: 700; }

mark {
  background: var(--md-blue-soft);
  color: var(--md-ink-900);
  padding: 0 4px;
  border-radius: 4px;
}

/* ============================================================
   4. Links
   ============================================================ */
a {
  color: var(--md-link);
  text-decoration: none;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: color var(--md-dur-fast) var(--md-ease);
}
a:hover { color: var(--md-blue-heavy); }

/* 본문 단락 내 인라인 링크만 underline — 제목/메타/칩 보호 */
.entry-content p a,
.entry-content li a,
.entry-content blockquote a {
  color: var(--md-link);
  text-decoration: underline;
  text-decoration-color: rgba(49, 130, 246, .25);
  text-underline-offset: 3px;
  transition: text-decoration-color var(--md-dur) var(--md-ease),
              color var(--md-dur-fast) var(--md-ease);
}
.entry-content p a:hover,
.entry-content li a:hover,
.entry-content blockquote a:hover { text-decoration-color: var(--md-link); }

/* 제목/메타/칩 안의 a 는 어떤 상태에서도 밑줄 없음 */
.entry-title a,
.entry-title a:hover,
.post-meta a,
.post-meta a:hover,
.entry-meta a,
.entry-meta a:hover,
.cat-links a,
.cat-links a:hover,
.tag-links a,
.tag-links a:hover,
.wp-block-post-terms a,
.wp-block-post-terms a:hover,
a[rel~="category"],
a[rel~="category"]:hover,
a[rel~="tag"],
a[rel~="tag"]:hover { text-decoration: none; }

/* ============================================================
   5. Buttons / Inputs
   ============================================================ */
button,
.button,
input[type="submit"],
input[type="button"],
.wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--md-space-2);
  padding: 12px 20px;
  min-height: 44px;
  border-radius: var(--md-radius-md);
  border: 1px solid transparent;
  background: var(--md-blue);
  color: #fff;
  font: 600 var(--md-fs-body)/1 var(--md-font-sans);
  letter-spacing: var(--md-ls-tight);
  cursor: pointer;
  transition: transform var(--md-dur-fast) var(--md-ease),
              background var(--md-dur-fast) var(--md-ease),
              box-shadow var(--md-dur-fast) var(--md-ease);
}
button:hover,
.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.wp-block-button__link:hover {
  background: var(--md-blue-heavy);
  box-shadow: var(--md-shadow-blue);
}
button:active,
.button:active { transform: translateY(1px); box-shadow: none; }
button:disabled,
.button:disabled { background: var(--md-ink-100); color: var(--md-ink-500); cursor: not-allowed; box-shadow: none; }

.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--md-blue);
  border-color: var(--md-blue);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--md-blue-soft);
  color: var(--md-blue-heavy);
  border-color: var(--md-blue-heavy);
}

/* Danger */
.button-danger,
.wp-block-button.is-style-danger .wp-block-button__link {
  background: var(--md-red);
}
.button-danger:hover { background: var(--md-red-pressed); }

input, select, textarea {
  font-family: var(--md-font-sans);
  font-size: var(--md-fs-body);
  color: var(--md-ink-900);
  background: var(--md-surface);
  border: 1px solid var(--md-ink-200);
  border-radius: var(--md-radius-sm);
  padding: 11px 14px;
  width: 100%;
  transition: border-color var(--md-dur-fast) var(--md-ease),
              box-shadow var(--md-dur-fast) var(--md-ease);
}
input::placeholder, textarea::placeholder { color: var(--md-ink-500); }
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--md-blue);
  box-shadow: 0 0 0 3px var(--md-blue-soft);
}
input:disabled { background: var(--md-ink-50); color: var(--md-ink-500); }

/* 검색 폼 */
.search-form { display: flex; gap: var(--md-space-2); }
.search-form .search-field { flex: 1; }
.search-form .search-submit { flex-shrink: 0; }

/* ============================================================
   6. Layout helpers
   ============================================================ */
/* 글 본문 장문은 전역 -1px 대신 몰 컴포넌트 자간(-0.2px) — 가독 확보 */
.entry-content { max-width: var(--md-content); margin: 0 auto; letter-spacing: -0.2px; }
.alignwide { max-width: 1040px; margin-left: auto; margin-right: auto; }
.alignfull { max-width: 100%; }

img, video { max-width: 100%; height: auto; display: block; }
img { border-radius: var(--md-radius-sm); }
.elementor img { border-radius: 0; }  /* Elementor 자체 위젯 보호 */

hr {
  border: 0;
  border-top: 1px solid var(--md-ink-100);
  margin: var(--md-space-10) 0;
}

/* ============================================================
   7. Blog 컴포넌트
   ============================================================ */
/* 포스트 카드 (테마/위젯 기본 article) */
.post-card,
article.post,
.wp-block-post-template > li {
  background: var(--md-surface);
  border: 1px solid var(--md-ink-100);
  border-radius: var(--md-radius-lg);
  overflow: hidden;
  transition: border-color var(--md-dur) var(--md-ease),
              box-shadow var(--md-dur) var(--md-ease),
              transform var(--md-dur) var(--md-ease);
}
.post-card:hover,
article.post:hover,
.wp-block-post-template > li:hover {
  border-color: var(--md-ink-200);
  box-shadow: var(--md-shadow-2);
  transform: translateY(-2px);
}

/* Featured image */
.post-thumbnail img,
.wp-block-post-featured-image img {
  aspect-ratio: 16 / 10;
  object-fit: cover;
  width: 100%;
  border-radius: var(--md-radius-md);
  transition: transform var(--md-dur-slow) var(--md-ease);
}
.post-card:hover .post-thumbnail img { transform: scale(1.02); }

/* Title in card */
.post-card .entry-title,
article.post .entry-title {
  font-size: var(--md-fs-h4);
  line-height: var(--md-lh-snug);
  margin: var(--md-space-3) 0 var(--md-space-2);
}
.entry-title a { color: var(--md-ink-900); }
.entry-title a:hover { color: var(--md-blue); text-decoration: none; }

.entry-excerpt,
.wp-block-post-excerpt {
  color: var(--md-ink-500);
  font-size: var(--md-fs-sm);
  line-height: var(--md-lh-snug);
}

/* 메타 */
.post-meta,
.entry-meta,
.wp-block-post-date,
.wp-block-post-author {
  font-size: var(--md-fs-xs);
  color: var(--md-ink-500);
  letter-spacing: var(--md-ls-normal);
}
.entry-meta a, .post-meta a { color: var(--md-ink-500); }
.entry-meta a:hover, .post-meta a:hover { color: var(--md-blue); }

/* 카테고리/태그 칩 */
.cat-links a,
.tag-links a,
.wp-block-categories-list a,
.wp-block-tag-cloud a,
.wp-block-post-terms a,
a[rel~="category"],
a[rel~="tag"] {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  margin: 0 4px 4px 0;
  border-radius: var(--md-radius-pill);
  background: var(--md-ink-50);
  color: var(--md-ink-700);
  font-size: var(--md-fs-xs);
  font-weight: 500;
  letter-spacing: var(--md-ls-normal);
  border: 1px solid transparent;
  transition: background var(--md-dur-fast) var(--md-ease),
              color var(--md-dur-fast) var(--md-ease),
              border-color var(--md-dur-fast) var(--md-ease);
}
.cat-links a:hover,
.tag-links a:hover,
.wp-block-categories-list a:hover,
.wp-block-tag-cloud a:hover,
.wp-block-post-terms a:hover,
a[rel~="category"]:hover,
a[rel~="tag"]:hover {
  background: var(--md-blue-soft);
  color: var(--md-blue-heavy);
  border-color: transparent;
}

/* 읽음 표시 / Eyebrow */
.eyebrow,
.category-label {
  display: inline-block;
  font-size: var(--md-fs-xxs);
  font-weight: 700;
  color: var(--md-blue);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: var(--md-space-2);
}

/* ============================================================
   8. Single Post — 본문
   ============================================================ */
.single-post .entry-title {
  font-size: clamp(28px, 3.4vw, 40px);
  font-weight: 800;
  margin-bottom: var(--md-space-4);
}

.single-post .entry-meta { margin-bottom: var(--md-space-8); }

.entry-content > * + * { margin-top: var(--md-space-5); }
.entry-content h2 {
  margin-top: var(--md-space-12);
  font-size: var(--md-fs-h2);
  padding-top: var(--md-space-2);
}
.entry-content h3 { margin-top: var(--md-space-10); }
.entry-content h4 { margin-top: var(--md-space-8); }

.entry-content ul,
.entry-content ol { padding-left: 1.4em; color: var(--md-ink-800); }
.entry-content li { margin-bottom: var(--md-space-2); }
.entry-content li::marker { color: var(--md-ink-500); }

.entry-content img,
.entry-content figure { border-radius: var(--md-radius-md); margin: var(--md-space-6) auto; }
.entry-content figure figcaption {
  font-size: var(--md-fs-xs);
  color: var(--md-ink-500);
  text-align: center;
  margin-top: var(--md-space-2);
}

/* Blockquote */
.wp-block-quote, blockquote {
  border-left: 3px solid var(--md-blue);
  padding: var(--md-space-4) var(--md-space-6);
  background: var(--md-ink-50);
  border-radius: 0 var(--md-radius-md) var(--md-radius-md) 0;
  color: var(--md-ink-800);
  margin: var(--md-space-8) 0;
  font-style: normal;
}
blockquote p:last-child { margin-bottom: 0; }
blockquote cite {
  display: block;
  margin-top: var(--md-space-3);
  font-size: var(--md-fs-sm);
  color: var(--md-ink-500);
  font-style: normal;
}

/* Pullquote */
.wp-block-pullquote {
  border: 0;
  border-top: 2px solid var(--md-ink-900);
  border-bottom: 2px solid var(--md-ink-900);
  padding: var(--md-space-8) 0;
  text-align: center;
}
.wp-block-pullquote p {
  font-size: var(--md-fs-h3);
  font-weight: 700;
  color: var(--md-ink-900);
  line-height: var(--md-lh-snug);
}

/* Inline code / pre */
code, kbd, samp {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.92em;
  background: var(--md-ink-50);
  color: var(--md-ink-800);
  padding: 2px 6px;
  border-radius: var(--md-radius-xs);
}
pre {
  background: var(--md-ink-900);
  color: #E5E8EB;
  padding: var(--md-space-5);
  border-radius: var(--md-radius-md);
  overflow-x: auto;
  font-size: var(--md-fs-sm);
  line-height: 1.6;
}
pre code { background: transparent; color: inherit; padding: 0; }

/* Table */
table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--md-fs-sm);
  margin: var(--md-space-6) 0;
  border-radius: var(--md-radius-md);
  overflow: hidden;
}
table thead { background: var(--md-ink-50); }
table th, table td {
  padding: var(--md-space-3) var(--md-space-4);
  border-bottom: 1px solid var(--md-ink-100);
  text-align: left;
}
table th { color: var(--md-ink-900); font-weight: 700; }
table tbody tr:hover { background: var(--md-ink-50); }
table tbody tr:last-child td { border-bottom: 0; }

/* Footnote / Highlight box */
.notice,
.entry-content .wp-block-callout {
  background: var(--md-blue-soft);
  border-left: 3px solid var(--md-blue);
  color: var(--md-ink-800);
  padding: var(--md-space-4) var(--md-space-5);
  border-radius: var(--md-radius-md);
  margin: var(--md-space-6) 0;
}
.notice-warn { background: var(--md-red-bg); border-left-color: var(--md-red); }

/* ============================================================
   9. Header / Footer / Navigation
   ============================================================ */
.site-header {
  border-bottom: 1px solid var(--md-ink-100);
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: saturate(180%) blur(10px);
  -webkit-backdrop-filter: saturate(180%) blur(10px);
}
.site-footer {
  border-top: 1px solid var(--md-ink-100);
  background: var(--md-ink-50);
  color: var(--md-ink-700);
  padding: var(--md-space-12) var(--md-space-4);
}
.site-footer a { color: var(--md-ink-700); }
.site-footer a:hover { color: var(--md-blue); }

/* Menu / Nav */
.menu a, nav a {
  color: var(--md-ink-800);
  font-weight: 500;
  letter-spacing: var(--md-ls-tight);
  transition: color var(--md-dur-fast) var(--md-ease);
}
.menu a:hover, nav a:hover { color: var(--md-blue); }
.current-menu-item > a { color: var(--md-blue); font-weight: 600; }

/* Pagination */
.nav-links,
.wp-block-query-pagination,
.pagination {
  display: flex;
  flex-wrap: wrap;
  gap: var(--md-space-2);
  justify-content: center;
  margin: var(--md-space-10) 0;
}
.nav-links a,
.page-numbers,
.wp-block-query-pagination a,
.wp-block-query-pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 var(--md-space-3);
  border-radius: var(--md-radius-sm);
  color: var(--md-ink-700);
  background: var(--md-ink-50);
  font-weight: 500;
  font-size: var(--md-fs-sm);
  transition: background var(--md-dur-fast) var(--md-ease),
              color var(--md-dur-fast) var(--md-ease);
}
.page-numbers.current,
.wp-block-query-pagination .current {
  background: var(--md-ink-900);
  color: #fff;
}
.nav-links a:hover,
.page-numbers:hover {
  background: var(--md-ink-100);
  color: var(--md-ink-900);
}

/* ============================================================
   10. Sidebar / Widgets
   ============================================================ */
.widget {
  background: var(--md-surface);
  border: 1px solid var(--md-ink-100);
  border-radius: var(--md-radius-lg);
  padding: var(--md-space-6);
  margin-bottom: var(--md-space-6);
}
.widget-title {
  font-size: var(--md-fs-h5);
  font-weight: 700;
  color: var(--md-ink-900);
  margin-bottom: var(--md-space-4);
}
.widget ul { list-style: none; padding: 0; margin: 0; }
.widget li {
  padding: var(--md-space-2) 0;
  border-bottom: 1px solid var(--md-ink-100);
}
.widget li:last-child { border-bottom: 0; }
.widget li a {
  color: var(--md-ink-800);
  display: inline-flex;
  align-items: center;
  font-size: var(--md-fs-sm);
}
.widget li a:hover { color: var(--md-blue); }

/* ============================================================
   11. Comments
   ============================================================ */
.comments-area {
  max-width: var(--md-content);
  margin: var(--md-space-14) auto 0;
  padding-top: var(--md-space-10);
  border-top: 1px solid var(--md-ink-100);
}
.comment-list { list-style: none; padding: 0; }
.comment-body {
  background: var(--md-ink-50);
  padding: var(--md-space-5);
  border-radius: var(--md-radius-md);
  margin-bottom: var(--md-space-4);
}
.comment-author { font-weight: 700; color: var(--md-ink-900); }
.comment-metadata { font-size: var(--md-fs-xs); color: var(--md-ink-500); }
.comment-respond textarea { min-height: 120px; }

/* ============================================================
   12. Archive 헤더 / Search 페이지
   ============================================================ */
.archive .page-header,
.search .page-header,
.archive-header {
  text-align: left;
  padding: var(--md-space-12) 0 var(--md-space-10);
  border-bottom: 1px solid var(--md-ink-100);
  margin-bottom: var(--md-space-10);
}
.archive-title,
.page-title {
  font-size: clamp(28px, 3.6vw, 40px);
  font-weight: 800;
  letter-spacing: var(--md-ls-display);
}
.archive-description {
  margin-top: var(--md-space-3);
  color: var(--md-ink-500);
  font-size: var(--md-fs-body);
  max-width: 640px;
}

/* ============================================================
   13. 유틸 클래스 (간헐 사용)
   ============================================================ */
.text-ink   { color: var(--md-ink-900); }
.text-sub   { color: var(--md-ink-700); }
.text-muted { color: var(--md-ink-500); }
.text-link  { color: var(--md-link); }
.text-brand { color: var(--md-blue); }
.bg-soft    { background: var(--md-blue-soft); }
.bg-section { background: var(--md-ink-50); }
.card-shadow { box-shadow: var(--md-shadow-2); }

.stack-2 > * + * { margin-top: var(--md-space-2); }
.stack-3 > * + * { margin-top: var(--md-space-3); }
.stack-4 > * + * { margin-top: var(--md-space-4); }
.stack-6 > * + * { margin-top: var(--md-space-6); }
.stack-8 > * + * { margin-top: var(--md-space-8); }

/* ============================================================
   14. 반응형 보정
   ============================================================ */
@media (max-width: 1024px) {
  .entry-content { padding: 0 var(--md-space-4); }
  .archive .page-header { padding: var(--md-space-8) var(--md-space-4) var(--md-space-6); }
}

@media (max-width: 600px) {
  body { font-size: 15px; }
  h1 { letter-spacing: var(--md-ls-tight); }
  .entry-content h2 { margin-top: var(--md-space-8); }
  .entry-content h3 { margin-top: var(--md-space-6); }
  blockquote { padding: var(--md-space-3) var(--md-space-4); }
}

/* ============================================================
   16. Elementor Loop / Posts 위젯 — 토스 카드
   Elementor 인라인 CSS specificity가 강해 !important 사용
   ============================================================ */

/* 카드 컨테이너 — 홈 소식 그리드(템플릿 88)는 배민식 박스리스라 제외 */
.e-loop-item:not(.elementor-88):not(.elementor-1395):not(.elementor-274) {
  background: var(--md-surface);
  border: 1px solid var(--md-ink-100);
  border-radius: var(--md-radius-lg) !important;
  overflow: hidden !important;
  transition: border-color var(--md-dur) var(--md-ease),
              box-shadow var(--md-dur) var(--md-ease),
              transform var(--md-dur) var(--md-ease);
}
.e-loop-item:not(.elementor-88):not(.elementor-1395):not(.elementor-274):hover {
  border-color: var(--md-ink-200);
  box-shadow: var(--md-shadow-2);
  transform: translateY(-2px);
}

/* 카드 안의 a 컨테이너 (topnews 등 e-con-boxed 패턴) */
.e-loop-item a.e-con,
.e-loop-item a[data-element_type="container"] {
  text-decoration: none !important;
  color: inherit !important;
  display: block;
}

/* 카드 안 모든 자식 a 의 underline 제거 (제목/메타까지 보호) */
.e-loop-item a,
.e-loop-item a:hover { text-decoration: none !important; }

/* Featured image — aspect ratio 통일 + hover zoom */
.e-loop-item .elementor-widget-image {
  overflow: hidden;
}
.e-loop-item .elementor-widget-image img {
  width: 100% !important;
  object-fit: cover;
  transition: transform var(--md-dur-slow) var(--md-ease);
}
.e-loop-item:hover .elementor-widget-image img {
  transform: scale(1.03);
}

/* Post Info (카테고리/태그) — 몰(skin49)식 회색 알약 칩.
   파란 링크 + | 구분자 나열이 어색했던 부분을 칩으로 정리 */
.e-loop-item .elementor-widget-post-info .elementor-icon-list-items {
  display: flex !important;
  flex-wrap: wrap;
  gap: 6px;
}
.e-loop-item .elementor-widget-post-info .elementor-icon-list-item {
  margin: 0 !important;
  padding: 0 !important;
}
/* 구분자(|, 쉼표 등 텍스트 노드) 제거: 컨테이너 font-size 0 → 항목에서 복원 */
.e-loop-item .elementor-widget-post-info .elementor-icon-list-items,
.e-loop-item .elementor-widget-post-info .elementor-icon-list-text,
.e-loop-item .elementor-widget-post-info .elementor-post-info__terms-list {
  font-size: 0 !important;
  letter-spacing: 0 !important;
}
.e-loop-item .elementor-widget-post-info .elementor-icon-list-text {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  background: transparent;
  padding: 0;
}
.e-loop-item .elementor-widget-post-info .elementor-post-info__terms-list {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}
/* 텀(카테고리/태그) 하나하나가 칩 */
.e-loop-item .elementor-widget-post-info .elementor-post-info__terms-list-item,
.e-loop-item .elementor-widget-post-info .elementor-icon-list-text > a {
  display: inline-flex !important;
  align-items: center;
  padding: 6px 11px;
  border-radius: var(--md-radius-pill);
  background: var(--md-ink-50);
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: -0.2px !important;
  color: var(--md-ink-700) !important;
  line-height: 1 !important;
  white-space: nowrap;
  transition: background var(--md-dur-fast) var(--md-ease),
              color var(--md-dur-fast) var(--md-ease);
}
.e-loop-item .elementor-widget-post-info .elementor-post-info__terms-list-item:hover,
.e-loop-item .elementor-widget-post-info .elementor-icon-list-text > a:hover {
  background: var(--md-blue-soft);
  color: var(--md-blue-heavy) !important;
}

/* Elementor 기본 | / 구분자 제거 (li 구분선 + 텀 뒤에 붙는 가상요소 전부) */
.e-loop-item .elementor-widget-post-info .elementor-icon-list-item::after,
.elementor-widget-post-info .elementor-post-info__terms-list-item::after,
.elementor-widget-post-info .elementor-post-info__terms-list-item::before {
  display: none !important;
  content: none !important;
}
/* 칩 앞 리스트 아이콘도 숨김 (칩 사이에 파란 아이콘이 끼는 문제) */
.e-loop-item .elementor-widget-post-info .elementor-icon-list-icon {
  display: none !important;
}
/* 루프 템플릿에 끼어있는 "|" 텍스트 위젯 제거 */
.e-loop-item .elementor-element-3cf7ac2 { display: none !important; }

/* 제목 */
.e-loop-item .elementor-widget-theme-post-title .elementor-heading-title,
.e-loop-item h2.elementor-heading-title,
.e-loop-item h3.elementor-heading-title {
  font-size: clamp(20px, 2.2vw, 28px) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: -1px !important;
  color: var(--md-ink-900) !important;
  transition: color var(--md-dur-fast) var(--md-ease);
  word-break: keep-all;
}
.e-loop-item:hover .elementor-widget-theme-post-title .elementor-heading-title,
.e-loop-item:hover h2.elementor-heading-title,
.e-loop-item:hover h3.elementor-heading-title {
  color: var(--md-blue-heavy) !important;
}

/* 부제 / Text Editor */
.e-loop-item .elementor-widget-text-editor {
  color: var(--md-ink-500) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  letter-spacing: var(--md-ls-normal) !important;
}

/* 작성자/날짜 메타 — 더 작게 */
.elementor-post__meta-data,
.elementor-post-date,
.elementor-post-author {
  font-size: var(--md-fs-xs) !important;
  color: var(--md-ink-500) !important;
  letter-spacing: var(--md-ls-normal) !important;
}

/* Elementor Posts 위젯 (Theme Builder Loop 외) */
.elementor-post {
  background: var(--md-surface);
  border: 1px solid var(--md-ink-100);
  border-radius: var(--md-radius-lg);
  overflow: hidden;
  transition: border-color var(--md-dur) var(--md-ease),
              box-shadow var(--md-dur) var(--md-ease),
              transform var(--md-dur) var(--md-ease);
}
.elementor-post:hover {
  border-color: var(--md-ink-200);
  box-shadow: var(--md-shadow-2);
  transform: translateY(-2px);
}
.elementor-post__thumbnail {
  border-radius: 0 !important;
  overflow: hidden;
}
.elementor-post__thumbnail__link {
  display: block;
  overflow: hidden;
}
.elementor-post__thumbnail img {
  transition: transform var(--md-dur-slow) var(--md-ease);
}
.elementor-post:hover .elementor-post__thumbnail img { transform: scale(1.03); }

.elementor-post__title {
  font-size: clamp(18px, 1.8vw, 22px) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: var(--md-ls-tight) !important;
}
.elementor-post__title a { color: var(--md-ink-900) !important; }
.elementor-post:hover .elementor-post__title a { color: var(--md-blue-heavy) !important; }

.elementor-post__excerpt p {
  color: var(--md-ink-500) !important;
  font-size: var(--md-fs-sm) !important;
  line-height: 1.55 !important;
}

.elementor-post__read-more {
  color: var(--md-blue) !important;
  font-weight: 600 !important;
  font-size: var(--md-fs-sm) !important;
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  transition: gap var(--md-dur-fast) var(--md-ease), color var(--md-dur-fast) var(--md-ease);
}
.elementor-post__read-more:hover {
  color: var(--md-blue-heavy) !important;
  gap: 8px;
}
.elementor-post__read-more::after {
  content: "→";
  display: inline-block;
  transition: transform var(--md-dur-fast) var(--md-ease);
}
.elementor-post:hover .elementor-post__read-more::after { transform: translateX(2px); }

/* Loop Grid 사이 간격 */
.elementor-posts-container,
.elementor-loop-container {
  gap: var(--md-space-6) !important;
}

/* ============================================================
   17. 글 하단 CTA + 태그 칩 — speedcos 블로그 템플릿 이식 (07-19)
   문법: 연회색 조용한 박스, 좌측 제목/설명 + 우측 블루 버튼.
   speedcos의 #0000EC 대신 메디리턴 공식 토큰(--md-blue #0064FF).
   ============================================================ */
.md-cta-block {
  margin: var(--md-space-16) auto var(--md-space-4);
  max-width: var(--md-content);
}

/* (07-19 솔리드 바 오버라이드는 플로팅 카드 전환으로 제거됨) */

.md-cta-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  background: var(--md-ink-50);
  border-radius: var(--md-radius-lg);
  padding: 28px 32px;
}

.md-cta-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -0.5px;
  color: var(--md-ink-900);
  margin: 0 0 6px;
  word-break: keep-all;
}

.md-cta-body {
  font-size: 14px;
  line-height: 1.6;
  color: var(--md-ink-500);
  margin: 0;
  word-break: keep-all;
}

.md-cta-button {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  background: var(--md-blue) !important;
  color: #fff !important;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: var(--md-ls-tight);
  border-radius: 10px;
  text-decoration: none !important;
  white-space: nowrap;
  transition: background var(--md-dur-fast) var(--md-ease),
              transform var(--md-dur-fast) var(--md-ease);
}
.md-cta-button:hover {
  background: var(--md-blue-heavy) !important;
  transform: translateY(-1px);
}
.md-cta-button:active { transform: translateY(0); }

.md-cta-arrow {
  transition: transform var(--md-dur-fast) var(--md-ease);
}
.md-cta-button:hover .md-cta-arrow { transform: translateX(3px); }

@media (max-width: 640px) {
  .md-cta-inner { flex-direction: column; align-items: flex-start; padding: 24px 20px; }
  .md-cta-button { width: 100%; justify-content: center; }
}

/* --- 글 하단 태그 = speedcos 해시태그 칩 문법 (# 프리픽스, 첫 칩 블루 강조) --- */
/* 쉼표는 텀 사이 텍스트 노드 → 리스트 font-size:0, 항목에서 복원 (post-info 공통 트릭) */
/* 공유 섹션("나만 보기 아깝다면?"+공유하기)·이전/다음 글 제거 — 07-19 사장님 "CTA 너무 많다/애매하다" */
.single-post .elementor-element-31d5e15,
.single-post .elementor-element-c6464bc,
.single-post .elementor-element-c506761 {
  display: none !important;
}

/* 태그 줄 = CTA 회색 박스와 같은 축(--md-content 중앙) — 07-19 사장님 지시 */
.single-post .elementor-element-7fb513c ul.elementor-post-info {
  max-width: var(--md-content);
  margin: 0 auto !important;
}
.single-post .elementor-element-7fb513c ul.elementor-post-info > li {
  margin: 0 !important; /* li 좌우 8px가 축을 밀어냄 */
}
@media (max-width: 1024px) {
  /* 모바일 본문 축 17px 정렬 — 위젯 자체 패딩 10px에 7px 보정(QnA 제목 축과 동일 패턴) */
  .single-post .elementor-element-7fb513c ul.elementor-post-info { padding: 0 7px !important; }
}

/* --- 저자 박스 = speedcos 문법(센터 아바타+이름+소개+글 더보기) — 태그 아래 주입(07-19 사장님 지시) --- */
/* 밴드 안의 옛 작성자 카드는 전 글에서 배제 */
.single-post .elementor-element-f29deec { display: none !important; }

.md-author {
  max-width: var(--md-content);
  margin: 0 auto;
  padding: 88px 0 16px;
  text-align: center;
}
.md-author__avatar {
  display: block;
  width: 120px !important;
  height: 120px !important;
  margin: 0 auto 26px;
  border-radius: 50% !important; /* .elementor img 라운드 리셋(0,1,1) 방어 */
  object-fit: cover;
  background: var(--md-ink-50);
}
.md-author__name {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.5px;
  color: var(--md-ink-900);
  margin-bottom: 14px;
}
.md-author__bio {
  max-width: 480px;
  margin: 0 auto 26px;
  font-size: 15px;
  line-height: 1.7;
  color: var(--md-ink-500);
  word-break: keep-all;
}
.md-author__more {
  display: inline-block;
  padding: 10px 18px;
  border-radius: 8px;
  background: var(--md-blue-soft);
  font-size: 14px;
  font-weight: 600;
  color: var(--md-blue) !important;
  text-decoration: none !important;
  transition: background var(--md-dur-fast) var(--md-ease),
              color var(--md-dur-fast) var(--md-ease);
}
.md-author__more:hover {
  background: var(--md-blue);
  color: #fff !important;
}

@media (max-width: 1024px) {
  .md-author { padding-top: 64px; }
  .md-author__avatar { width: 96px !important; height: 96px !important; }
  .md-author__name { font-size: 19px; }
  .md-author__bio { font-size: 14px; padding: 0 16px; }
}

/* 인라인 조상 체인(ul>li>span)이 폭 제약을 못 걸어 모바일 오버플로 → 전부 블록화 */
.single-post .elementor-element-7fb513c .elementor-icon-list-item,
.single-post .elementor-element-7fb513c .elementor-post-info__item {
  display: block !important;
}
.single-post .elementor-element-7fb513c .elementor-post-info__terms-list {
  font-size: 0;
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
}
.single-post .elementor-element-7fb513c .elementor-post-info__terms-list-item {
  display: inline-block !important;
  margin: 0 !important; /* 템플릿(post-252)의 칩 마진 12.8px 제거 — 간격은 리스트 gap 8px만 */
  padding: 9px 16px !important;
  border: 1px solid var(--md-ink-200);
  border-radius: var(--md-radius-pill);
  background: #fff !important;
  font-size: 13px !important;
  font-weight: 500;
  line-height: 1.5 !important;
  color: var(--md-ink-500) !important;
  text-decoration: none !important;
  transition: border-color var(--md-dur-fast) var(--md-ease),
              color var(--md-dur-fast) var(--md-ease);
}
/* §헤더의 post-info ::before 전역 킬(!important)이 여기도 먹어서 동급 !important로 복원 */
.single-post .elementor-element-7fb513c .elementor-post-info__terms-list-item::before {
  content: "#" !important;
  display: inline !important;
  margin-right: 1px;
  opacity: .7;
}
/* 템플릿의 옛 호버(파란 채움 #0078c1 + 흰 글자 !important) 차단 — 흰 배경+블루 라인 유지 */
.single-post .elementor-element-7fb513c .elementor-post-info__terms-list-item:hover {
  background: #fff !important;
  border-color: var(--md-blue) !important;
  color: var(--md-blue) !important;
}

/* ============================================================
   19. 메인(홈) 리디자인 — 공식몰 skin49 디자인 언어 정합
   섹션 리듬: 넓은 여백 + 센터 타이틀(영문 eyebrow) + 라운드 카드
   ============================================================ */

/* --- 19-0. 섹션 리듬 --------------------------------------- */
.home .elementor-element-f24ff40 { padding: 48px 0 0 !important; }
.home .elementor-element-3ce2059 { padding: 110px 0 0 !important; min-height: 0 !important; }
.home .elementor-element-7bed069 { padding: 110px 0 140px !important; min-height: 0 !important; }
.home .elementor-element-e08d276 { padding: 110px 0 120px !important; min-height: 0 !important; }
/* 섹션 내부 e-con-inner에 박힌 상하 80px 패딩 제거 — 유령 여백의 원인 */
.home .elementor-element-3ce2059 > .e-con-inner,
.home .elementor-element-7bed069 > .e-con-inner,
.home .elementor-element-e08d276 > .e-con-inner,
.home .elementor-element-f24ff40 > .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* 섹션 타이틀 공통 — 몰의 main-sec-title 패턴 (센터, 영문 eyebrow) */
.home .elementor-element-c5c825f .elementor-heading-title,
.home .elementor-element-7ccbc32 .elementor-heading-title,
.home .elementor-element-856f2b7 .elementor-heading-title {
  text-align: center !important;
  font-size: clamp(23px, 2.4vw, 28px) !important;
  font-weight: 700 !important;
  letter-spacing: -1px !important;
  color: var(--md-ink-900) !important;
  line-height: 1.3 !important;
}
.home .elementor-element-c5c825f,
.home .elementor-element-7ccbc32,
.home .elementor-element-856f2b7 { margin-bottom: 12px !important; }
/* 뉴스 그리드가 갖고 있던 자체 상단 여백 제거 (widget-container mt 40px) */
.elementor-element-6f8910d,
.elementor-element-6f8910d > .elementor-widget-container {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.home .elementor-element-c5c825f .elementor-heading-title::before,
.home .elementor-element-7ccbc32 .elementor-heading-title::before,
.home .elementor-element-856f2b7 .elementor-heading-title::before {
  display: block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--md-blue);
  margin-bottom: 10px;
}
.home .elementor-element-c5c825f .elementor-heading-title::before { content: "Return Time"; }
.home .elementor-element-7ccbc32 .elementor-heading-title::before { content: "New Posts"; }
.home .elementor-element-856f2b7 .elementor-heading-title::before { content: "Live Top 3"; }

/* --- 19-1. 히어로 — 배민 b컷 벤치마킹: 카드 박스 없이 이미지+텍스트 ---- */
.home .elementor-element-72c886e,
.home .elementor-element-72c886e * {
  border: none !important;               /* 이중 테두리 원인 전부 제거 */
  box-shadow: none !important;
}
.home .elementor-element-72c886e {
  border-radius: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  gap: 72px !important;
}
/* 실제 컬럼 간격은 e-con-inner에 걸림 — 배민 수준으로 */
.home .elementor-element-72c886e > .e-con-inner {
  gap: 72px !important;
}
.home .elementor-element-f24ff40 .e-loop-item {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}
/* 히어로는 카드 lift 예외 — 큰 면적이 움직이면 어색 */
.home .elementor-element-f24ff40 .e-loop-item:hover { transform: none; }

/* 좌: 이미지 — 라운드만 살짝 */
.home .elementor-element-e10436e { border-radius: 0 !important; background: transparent !important; }
.home .elementor-element-ac379e7 img { border-radius: 20px !important; }

/* 우: 텍스트 — 패널 박스 없이 수직 중앙 */
.home .elementor-element-c3d17f1 {
  justify-content: center !important;
  background: transparent !important;
  padding: 24px 0 !important;
  gap: 16px !important;
}
/* 카테고리 eyebrow — 칩 대신 플레인 블루 텍스트 */
.home .elementor-element-10fbf86 .elementor-icon-list-items {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 !important;      /* 리스트 기본 오프셋(-8px) 제거 — 제목과 좌측 정렬 */
  padding: 0 !important;
}
.home .elementor-element-10fbf86 .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; }
.home .elementor-element-10fbf86 .elementor-icon-list-item::after { display: none !important; }
.home .elementor-element-10fbf86 .elementor-icon-list-icon { display: none !important; }
.home .elementor-element-10fbf86 .elementor-icon-list-text,
.home .elementor-element-10fbf86 .elementor-post-info__terms-list { font-size: 0 !important; gap: 10px; background: transparent !important; padding: 0 !important; display: inline-flex !important; align-items: center; }
.home .elementor-element-10fbf86 .elementor-post-info__terms-list-item,
.home .elementor-element-10fbf86 .elementor-icon-list-text > a {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--md-blue) !important;
  letter-spacing: -0.2px !important;
  line-height: 1.4 !important;
  background: transparent !important;
  padding: 0 !important;
}
/* 배민처럼 대표 카테고리 하나만 노출 (글에 여러 개 지정돼 있어도) */
.home .elementor-element-10fbf86 .elementor-post-info__terms-list-item:not(:first-child),
.home .elementor-element-10fbf86 .elementor-icon-list-text > a:not(:first-of-type) {
  display: none !important;
}
/* 히어로 타이틀 */
.home .elementor-element-b6e987b .elementor-heading-title {
  font-size: clamp(26px, 2.8vw, 36px) !important;
  font-weight: 800 !important;
  line-height: 1.32 !important;
  letter-spacing: -1px !important;
  color: var(--md-ink-900) !important;
  word-break: keep-all;
}
/* 호버 시에도 제목 색 유지 — §16의 카드 제목 블루 호버가 히어로엔 과함 */
.home .elementor-element-b6e987b .elementor-heading-title a { color: inherit !important; }
.home .elementor-element-72c886e:hover .elementor-element-b6e987b .elementor-heading-title,
.home .elementor-element-72c886e:hover .elementor-element-b6e987b .elementor-heading-title a {
  color: var(--md-ink-900) !important;
}
/* 히어로 요약문 */
.home .elementor-element-d3a8954,
.home .elementor-element-d3a8954 p {
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: var(--md-ink-500) !important;
  letter-spacing: -0.2px !important;
}
/* "자세히 보기" 제거 — 배민식 미니멀(카테고리·제목·요약만) */

/* --- 19-2. 카테고리 내비 — skin50 메인 타일 패턴(라운드 스퀘어 86px)
       + 토스풍 듀오톤 SVG 아이콘 -------------------------------- */
.home .elementor-element-fa10305 {
  grid-template-columns: repeat(7, max-content) !important;
  justify-content: center !important;
  gap: 8px 40px !important;
}
.home .elementor-element-fa10305 .elementor-widget-image-box .elementor-image-box-img {
  width: 86px;
  height: 86px;
  margin: 0 auto 10px !important;
  border-radius: 26px;                 /* skin50 spd-cat-thumb */
  background: #F5F6F8;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, transform .15s ease;
}
.home .elementor-element-fa10305 .elementor-widget-image-box .elementor-image-box-img a {
  display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;
}
/* 기존 임시 PNG 숨기고 토스풍 SVG로 교체 */
.home .elementor-element-fa10305 .elementor-widget-image-box img { display: none !important; }
.home .elementor-element-fa10305 .elementor-widget-image-box .elementor-image-box-img a::before {
  content: "";
  width: 44px;
  height: 44px;
  background-size: contain;      /* shorthand 금지 — 개별 background-image를 덮어버림 */
  background-position: center;
  background-repeat: no-repeat;
}
/* 여드름/트러블 — 트러블 도트 */
.home .elementor-element-3772b5b .elementor-image-box-img a::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%235b6470" stroke-width="1.1" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="8.4"/><circle cx="9" cy="9.5" r="0.55" fill="%235b6470" stroke="none"/><circle cx="14.8" cy="8.8" r="0.55" fill="%235b6470" stroke="none"/><circle cx="15.5" cy="13" r="0.55" fill="%235b6470" stroke="none"/><circle cx="8.2" cy="13.5" r="0.55" fill="%235b6470" stroke="none"/><path d="M10 15.5q2 1.6 4 0"/></svg>');
}
/* 모공/피지 — 피지 방울 */
.home .elementor-element-a843bfd .elementor-image-box-img a::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%235b6470" stroke-width="1.1" stroke-linecap="round" stroke-linejoin="round"><path d="M4 15.5c2.5-3.5 5-5 8-5s5.5 1.5 8 5"/><circle cx="9" cy="12.2" r="0.55" fill="%235b6470" stroke="none"/><circle cx="12" cy="11.6" r="0.55" fill="%235b6470" stroke="none"/><circle cx="15" cy="12.2" r="0.55" fill="%235b6470" stroke="none"/><path d="M12 16.2c1.5 1.8 2.4 3 2.4 4.2a2.4 2.4 0 0 1-4.8 0c0-1.2.9-2.4 2.4-4.2z"/></svg>');
}
/* 흉터/흔적 — 반창고 */
.home .elementor-element-327f42f .elementor-image-box-img a::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%235b6470" stroke-width="1.1" stroke-linecap="round" stroke-linejoin="round"><g transform="rotate(-45 12 12)"><rect x="3.5" y="8.5" width="17" height="7" rx="3.5"/><path d="M8.8 8.5v7M15.2 8.5v7"/><circle cx="11" cy="11" r="0.45" fill="%235b6470" stroke="none"/><circle cx="13" cy="11" r="0.45" fill="%235b6470" stroke="none"/><circle cx="11" cy="13" r="0.45" fill="%235b6470" stroke="none"/><circle cx="13" cy="13" r="0.45" fill="%235b6470" stroke="none"/></g></svg>');
}
/* 피부 장벽 — 방패 체크 */
.home .elementor-element-776b146 .elementor-image-box-img a::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%235b6470" stroke-width="1.1" stroke-linecap="round" stroke-linejoin="round"><path d="M12 3.5l7 2.6v5.2c0 4.6-3 8.4-7 10.2-4-1.8-7-5.6-7-10.2V6.1l7-2.6z"/><path d="M9 12l2.2 2.2L15.5 10"/></svg>');
}
/* 피부 타입 — 레이어 */
.home .elementor-element-929e9a7 .elementor-image-box-img a::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%235b6470" stroke-width="1.1" stroke-linecap="round" stroke-linejoin="round"><path d="M12 4l8 4.4L12 12.8 4 8.4 12 4z"/><path d="M4.5 12.5L12 16.6l7.5-4.1"/><path d="M4.5 16.5L12 20.6l7.5-4.1"/></svg>');
}
/* 피부 상담소 — 말풍선 플러스 */
.home .elementor-element-26cf0e2 .elementor-image-box-img a::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%235b6470" stroke-width="1.1" stroke-linecap="round" stroke-linejoin="round"><path d="M12 4.5c-4.9 0-8.5 3.2-8.5 7.1 0 2.3 1.3 4.3 3.3 5.6l-.6 3.2 3.8-1.9c.6.1 1.3.2 2 .2 4.9 0 8.5-3.2 8.5-7.1S16.9 4.5 12 4.5z"/><path d="M12 8.6v6M9 11.6h6"/></svg>');
}
/* 전체보기 — 그리드 */
.home .elementor-element-e9615a2 .elementor-image-box-img a::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%235b6470" stroke-width="1.1" stroke-linecap="round" stroke-linejoin="round"><rect x="4.5" y="4.5" width="6.2" height="6.2" rx="2"/><rect x="13.3" y="4.5" width="6.2" height="6.2" rx="2"/><rect x="4.5" y="13.3" width="6.2" height="6.2" rx="2"/><rect x="13.3" y="13.3" width="6.2" height="6.2" rx="2"/></svg>');
}
/* 호버 — skin50과 동일한 스케일 인터랙션 */
.home .elementor-element-fa10305 .elementor-widget-image-box:hover .elementor-image-box-img {
  background: #EDF0F3;
  transform: scale(1.04);
}
.home .elementor-element-fa10305 .elementor-widget-image-box:active .elementor-image-box-img {
  transform: scale(0.94);
}
.home .elementor-element-fa10305 .elementor-image-box-title,
.home .elementor-element-fa10305 .elementor-image-box-title a {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--md-ink-800) !important;
  letter-spacing: -0.2px !important;
  line-height: 1.25 !important;
}
.home .elementor-element-fa10305 .elementor-widget-image-box:hover .elementor-image-box-title a {
  color: var(--md-blue-heavy) !important;
}

/* --- 19-3. 소식 카드 — 배민 b컷 문법(박스 없는 이미지+텍스트) --- */
/* 카드 박스 해제 — 템플릿 88(.elementor-88) 아이템은 어디서 렌더되든 박스 금지
   (§16 전역 카드 스타일이 어떤 경로로든 되살아나지 않도록 이중 잠금) */
.elementor-88.e-loop-item,
.elementor-88.e-loop-item:hover,
.elementor-88.e-loop-item .subnews,
.elementor-88.e-loop-item [class*="elementor-element"] {
  border: none !important;
  box-shadow: none !important;
}
.elementor-88.e-loop-item,
.elementor-88.e-loop-item:hover {
  background: transparent !important;
  border-radius: 0 !important;
  transform: none !important;
}
.elementor-88.e-loop-item,
.elementor-88.e-loop-item:hover {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  transform: none !important;
  overflow: visible !important;
}
/* 이미지 라운드 + 호버 줌 (래퍼 클립 + img 직접 라운드 이중 방어) */
.elementor-88.e-loop-item .elementor-element-e823ea5 {
  border-radius: 16px;
  overflow: hidden;
}
.elementor-88.e-loop-item .elementor-element-e823ea5 img {
  border-radius: 16px !important;
}
.elementor-88.e-loop-item .elementor-element-0bc558b,
.elementor-88.e-loop-item .elementor-element-0bc558b > .e-con-inner {
  border-radius: 16px;
  background: transparent !important;
}
.elementor-88.e-loop-item .elementor-element-e823ea5 img {
  transition: transform .35s ease;
}
.elementor-88.e-loop-item:hover .elementor-element-e823ea5 img {
  transform: scale(1.03);
}
/* 카드 루트의 이미지-본문 사이 기본 gap(20px) 제거 — 패딩으로만 제어 */
.elementor-88.e-loop-item,
.elementor-88.e-loop-item > .e-con-inner,
.elementor-88.e-loop-item .elementor-element-22b1c9e,
.elementor-88.e-loop-item .elementor-element-22b1c9e > .e-con-inner {
  gap: 0 !important;
  row-gap: 0 !important;
}
/* 본문 컨테이너 — 카드 패딩 제거, 이미지와 같은 좌측 라인 */
.elementor-88.e-loop-item .elementor-element-890e8c1 {
  padding: 14px 2px 0 !important;
  background: transparent !important;
  gap: 7px !important;
}
/* 카테고리 라벨(1c48285) — 배민식 블루 볼드, 제목 위로, 첫 카테고리만 */
.elementor-88.e-loop-item .elementor-element-ff56920 { order: -1; padding: 0 !important; }
.elementor-88.e-loop-item .elementor-element-1c48285 .elementor-icon-list-items {
  margin: 0 !important;      /* 리스트 기본 -8px 오프셋 제거 — 제목과 좌측 정렬 */
  padding: 0 !important;
}
/* 라벨 li 자체의 내부 여백(높이 27px) 압축 — 제목과의 간격 축소 */
.elementor-88.e-loop-item .elementor-element-1c48285 .elementor-icon-list-item {
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
}
.elementor-88.e-loop-item .elementor-element-1c48285 .elementor-icon-list-text,
.elementor-88.e-loop-item .elementor-element-1c48285 .elementor-post-info__terms-list {
  background: transparent !important;
  padding: 0 !important;
}
.elementor-88.e-loop-item .elementor-element-1c48285 .elementor-post-info__terms-list-item,
.elementor-88.e-loop-item .elementor-element-1c48285 .elementor-icon-list-text > a {
  background: transparent !important;
  padding: 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--md-blue) !important;
}
.elementor-88.e-loop-item .elementor-element-1c48285 .elementor-post-info__terms-list-item:not(:first-child),
.elementor-88.e-loop-item .elementor-element-1c48285 .elementor-icon-list-text > a:not(:first-of-type) {
  display: none !important;
}
/* 태그 칩(19f7d33)은 정보 과잉 — 숨김 */
.elementor-88.e-loop-item .elementor-element-19f7d33 { display: none !important; }
/* 구 템플릿의 카드 사이 세로 구분선(subnews::after) 제거 — 애매한 테두리의 정체 */
.elementor-88.e-loop-item .subnews::before,
.elementor-88.e-loop-item .subnews::after {
  content: none !important;
  display: none !important;
}

/* --- 19-3b. 소식 카드 그리드 보정 --------------------------- */
/* 썸네일 비율 통일 */
.elementor-88.e-loop-item .elementor-element-e823ea5 img {
  aspect-ratio: 16 / 10;
  object-fit: cover;
  width: 100% !important;
  border-radius: 0 !important;
}
/* 카드 내부 패딩 리듬 */
.elementor-88.e-loop-item .elementor-element-890e8c1 { gap: 10px !important; }
/* 카드 타이틀 — 1줄 말줄임(…)으로 배열 고정 */
.elementor-88.e-loop-item .elementor-widget-theme-post-title .elementor-heading-title {
  font-size: 19px !important;
  font-weight: 700 !important;
  line-height: 1.42 !important;
  letter-spacing: -1px !important;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* 요약문 1줄 클램프 — 배민식 서브텍스트 */
.elementor-88.e-loop-item .elementor-element-914ee7d,
.elementor-88.e-loop-item .elementor-element-914ee7d p {
  font-size: 14.5px !important;
  line-height: 1.55 !important;
  color: var(--md-ink-500) !important;
}
.elementor-88.e-loop-item .elementor-element-914ee7d .elementor-widget-container {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 더보기 버튼 — 몰 CTA 패턴 (알약, 솔리드 블루) */
.home .e-loop__load-more { margin-top: 48px; }
.home .e-loop__load-more .elementor-button {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  height: 52px;
  padding: 0 32px !important;
  border-radius: var(--md-radius-pill) !important;
  background: var(--md-blue) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: -0.2px !important;
  box-shadow: none !important;
  transition: background var(--md-dur-fast) var(--md-ease),
              transform var(--md-dur-fast) var(--md-ease),
              box-shadow var(--md-dur-fast) var(--md-ease);
}
.home .e-loop__load-more .elementor-button:hover {
  background: var(--md-blue-heavy) !important;
  transform: translateY(-1px);
  box-shadow: var(--md-shadow-blue) !important;
}
.home .e-loop__load-more .elementor-button-icon svg { width: 12px; fill: #fff; }

/* --- 19-4. 실시간 피부 고민 TOP 3 — 임시 숨김 (사장님 지시 07-15)
       되살리려면 아래 한 줄만 제거 ----------------------------- */
.home .elementor-element-e08d276 { display: none !important; }

/* --- (구) 실시간 피부 고민 TOP 3 — Q 카드 ------------------- */
.home .elementor-element-e93fd7c { gap: 12px !important; }
.home .elementor-element-e93fd7c > .e-con-inner { gap: 12px !important; }
/* 위젯 자체의 회색 배경/패딩 제거 (이중 프레임 방지) */
.home .elementor-element-d080dc1,
.home .elementor-element-ce3619f,
.home .elementor-element-7d7b33b {
  background: transparent !important;
  padding: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.home .elementor-element-d080dc1 .elementor-heading-title,
.home .elementor-element-ce3619f .elementor-heading-title,
.home .elementor-element-7d7b33b .elementor-heading-title {
  display: flex !important;
  align-items: center;
  gap: 14px;
  background: var(--md-surface) !important;
  border: 1px solid var(--md-ink-100);
  border-radius: var(--md-radius-lg) !important;
  padding: 18px 24px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--md-ink-800) !important;
  letter-spacing: -0.2px !important;
  line-height: 1.5 !important;
  text-align: left !important;
  word-break: keep-all;
  transition: border-color var(--md-dur) var(--md-ease),
              box-shadow var(--md-dur) var(--md-ease),
              transform var(--md-dur) var(--md-ease);
}
.home .elementor-element-d080dc1 .elementor-heading-title::before,
.home .elementor-element-ce3619f .elementor-heading-title::before,
.home .elementor-element-7d7b33b .elementor-heading-title::before {
  content: "Q";
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--md-blue-soft);
  color: var(--md-blue);
  font-size: 15px;
  font-weight: 800;
}
.home .elementor-element-d080dc1 .elementor-heading-title:hover,
.home .elementor-element-ce3619f .elementor-heading-title:hover,
.home .elementor-element-7d7b33b .elementor-heading-title:hover {
  border-color: #BFD7FA;
  box-shadow: 0 6px 20px rgba(0,100,255,.08);
  transform: translateY(-2px);
}
/* 사이 divider 는 숨김 */
.home .elementor-element-6966851 { display: none !important; }

/* ============================================================
   20. 헤더 / 푸터 (Elementor 템플릿) — 몰 헤더·푸터 정합
   ============================================================ */

/* --- 20-1. 헤더 — 몰 skin50 header_ver_1 정합 ---------------- */
.elementor-element-f6f6c3a {
  background: #fff !important;
  border-bottom: none !important;
  padding-inline: 24px !important;
}
/* 몰 spd-inner: width 90% / max 1440px */
.elementor-element-f6f6c3a > .e-con-inner {
  max-width: 1440px !important;
  width: 100%;
  margin-inline: auto;
}
/* 로고 — 몰 PC 로고폭(162px)에 맞춤 */
.elementor-element-e889488 img { width: 180px !important; height: auto !important; }

/* GNB (Elementor 메가메뉴 n-menu) — skin50 gnb 스펙 */
/* 몰처럼 GNB 절대 중앙 정렬 */
@media (min-width: 1025px) {
  .elementor-element-f6f6c3a > .e-con-inner { position: relative; }
  .elementor-element-f814924 {
    position: absolute !important;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: max-content !important;
    max-width: none !important;
  }
  /* GNB가 absolute로 빠지면서 우측 요소가 왼쪽에 붙는 것 방지 */
  .elementor-element-059839a { margin-left: auto !important; }
}
.elementor-element-f814924 .e-n-menu-heading { gap: 0 !important; }
.elementor-element-f814924 .e-n-menu-title {
  position: relative;
  padding: 0 15px !important;
  margin: 0 5px !important;
  min-height: 64px;
  display: flex;
  align-items: center;
}
.elementor-element-f814924 .e-n-menu-title-text {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: var(--md-ink-900) !important;
  letter-spacing: -0.2px !important;
  white-space: nowrap;
  transition: color .25s ease, opacity .25s ease;
}
/* 몰 시그니처 hover dim — 다른 항목은 흐려지고 대상만 강조(#3767AC) */
.elementor-element-f814924 .e-n-menu-heading:hover .e-n-menu-title-text {
  color: #aaa !important;
  opacity: .5;
}
.elementor-element-f814924 .e-n-menu-heading .e-n-menu-title:hover .e-n-menu-title-text,
.elementor-element-f814924 .e-n-menu-title[aria-expanded="true"] .e-n-menu-title-text {
  color: #3767AC !important;
  opacity: 1;
  font-weight: 600 !important;
}
/* 화살표 버튼은 숨기되 클릭 영역은 타이틀 전체로 확장 */
.elementor-element-f814924 .e-n-menu-dropdown-icon {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 드롭다운 — skin50 deep-2: 세로 리스트 화이트 카드, 해당 항목 바로 아래 센터 */
.elementor-element-f814924 .e-n-menu-item { position: relative; }
.elementor-element-f814924 .e-n-menu-content {
  position: absolute !important;
  top: 100% !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%);
  width: max-content !important;
  max-width: none !important;
  z-index: 100;
}
.elementor-element-f814924 .e-n-menu-content > .e-con {
  background: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .10) !important;
  width: max-content !important;
  min-width: 150px;
  margin: 6px auto 0 !important;
  padding: 8px 0 !important;
  min-height: 0 !important;
}
.elementor-element-f814924 .e-n-menu-content > .e-con > .e-con-inner {
  padding: 0 !important;
  width: auto !important;
}
/* 항목 — 세로, 행높이 42px, 센터 정렬 */
.elementor-element-f814924 .e-n-menu-content .elementor-icon-list-items {
  display: flex !important;
  flex-direction: column;
  gap: 0;
}
.elementor-element-f814924 .e-n-menu-content .elementor-icon-list-item {
  margin: 0 !important;
  padding: 0 !important;
  width: 100%;
}
.elementor-element-f814924 .e-n-menu-content .elementor-icon-list-item::after { display: none !important; }
.elementor-element-f814924 .e-n-menu-content .elementor-icon-list-item a {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 42px;
  padding: 0 24px;
  transition: color .18s ease;
}
.elementor-element-f814924 .e-n-menu-content .elementor-icon-list-text {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #444 !important;
  letter-spacing: 0 !important;
  transition: color .18s ease;
}
.elementor-element-f814924 .e-n-menu-content .elementor-icon-list-item a:hover .elementor-icon-list-text {
  color: #6189C0 !important;
  font-weight: 500 !important;
}
/* 공식몰 바로가기 — 몰 헤더 "로그인" 링크와 동일한 블루 볼드 텍스트
   (원문 "->"는 font-size 0으로 숨기고 ::before로 재구성) */
.elementor-element-fecb72e { background: transparent !important; }
/* 스와이퍼 슬롯이 짜부되지 않게 고정 폭 확보 (필 폭 + 여유) */
.elementor-element-7a812e2 {
  width: 152px !important;
  min-width: 152px !important;
  flex: 0 0 auto !important;
}
.elementor-element-7a812e2 .swiper-slide {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end;
}
/* 스와이퍼 체인 높이를 필(30px)에 고정 — 패딩 밀림/높이0 클리핑 둘 다 방지 */
.elementor-element-7a812e2,
.elementor-element-7a812e2 .swiper,
.elementor-element-7a812e2 .swiper-wrapper,
.elementor-element-7a812e2 .swiper-slide,
.elementor-element-864e612,
.elementor-element-864e612 > .e-con-inner,
.elementor-element-77e2ff7 {
  height: 30px !important;
  min-height: 0 !important;
  overflow: visible !important;
}
.elementor-element-864e612 > .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: flex;
  justify-content: flex-end;   /* 필을 슬롯 오른쪽 끝으로 — 검색바와의 간격 최소화 */
}
/* 우측 칼럼(공식몰·검색) 수직 중앙 + 간격 압축 */
.elementor-element-059839a {
  align-items: center !important;
  gap: 8px !important;
}
.elementor-element-7a812e2 .swiper-slide { padding-right: 0; }
.elementor-element-77e2ff7 .elementor-heading-title {
  background: transparent !important;
  padding: 0 !important;
}
.elementor-element-77e2ff7 .elementor-heading-title { line-height: 1 !important; }
.elementor-element-77e2ff7 .elementor-heading-title a {
  display: inline-block !important;      /* line-height 방식으로 수직 고정 */
  font-size: 0 !important;              /* 원문 "공식몰 바로가기 ->" 숨김 */
  height: 30px !important;
  line-height: 30px !important;
  padding: 0 13px !important;
  border-radius: var(--md-radius-pill) !important;
  background: var(--md-blue-soft) !important;   /* 몰 배지 톤의 소프트 블루 필 */
  white-space: nowrap;
  transition: background var(--md-dur-fast) var(--md-ease),
              box-shadow var(--md-dur-fast) var(--md-ease);
}
.elementor-element-77e2ff7 .elementor-heading-title a::before {
  content: "공식몰 바로가기 ↗";
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.2px;
  line-height: 30px;
  vertical-align: top;
  color: var(--md-blue);
  white-space: nowrap;
  transition: color var(--md-dur-fast) var(--md-ease);
}
.elementor-element-77e2ff7 .elementor-heading-title a:hover {
  background: #D6E8FF !important;
  box-shadow: 0 2px 8px rgba(0, 100, 255, .12);
}
.elementor-element-77e2ff7 .elementor-heading-title a:hover::before {
  color: var(--md-blue-heavy);
}
@media (max-width: 1024px) {
  .elementor-element-77e2ff7 .elementor-heading-title a {
    padding: 0 11px !important;
  }
  .elementor-element-77e2ff7 .elementor-heading-title a::before {
    content: "공식몰 ↗";
    font-size: 12px;
    line-height: 30px;
    vertical-align: top;
  }
}
/* 검색 팝업 — 몰의 알약 검색바 패턴 */
.e-search .e-search-input-wrapper .e-search-input {
  height: 60px;
  border-radius: var(--md-radius-pill) !important;
  background: var(--md-ink-50) !important;
  border: 1px solid transparent !important;
  padding: 0 52px 0 58px !important;  /* 좌측 돋보기 아이콘과 겹치지 않게 */
  font-size: 17px !important;
  letter-spacing: -0.2px;
  transition: background var(--md-dur-fast) var(--md-ease),
              border-color var(--md-dur-fast) var(--md-ease),
              box-shadow var(--md-dur-fast) var(--md-ease);
}
.e-search .e-search-input-wrapper .e-search-input:focus {
  background: #fff !important;
  border-color: var(--md-blue) !important;
  box-shadow: 0 0 0 3px var(--md-blue-soft) !important;
}
/* 팝업 테마가 입력 글자를 흰색으로 덮는 문제 — 명시적으로 잉크 컬러 지정 */
.e-search .e-search-input-wrapper .e-search-input,
.elementor-popup-modal .e-search-input {
  color: var(--md-ink-900) !important;
  -webkit-text-fill-color: var(--md-ink-900) !important;
}
.e-search .e-search-input::placeholder,
.elementor-popup-modal .e-search-input::placeholder {
  color: var(--md-ink-300) !important;
  -webkit-text-fill-color: var(--md-ink-300) !important;
  font-size: 17px;
  opacity: 1;
}
.e-search .e-search-label svg { fill: var(--md-ink-500); width: 20px; }

/* 검색 — 몰 skin50 알약 검색바 모양(클릭하면 기존 검색 팝업 오픈) */
/* 위젯 슬롯이 94px 고정이라 알약(190px)이 잘림 → 슬롯을 내용 폭으로
   (엘리멘터는 --width 변수를 max-width로 걸어 잠그므로 둘 다 해제) */
.elementor-element-059839a {
  width: max-content !important;
  max-width: none !important;
  --width: max-content;
  flex: 0 0 auto !important;
}
.elementor-element-aad3834,
.elementor-element-aad3834 .elementor-icon-wrapper {
  width: max-content !important;
  max-width: none !important;
  --container-widget-width: max-content;
  flex: 0 0 auto !important;
}
.elementor-element-aad3834 .elementor-icon {
  display: inline-flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  width: 190px;
  height: 36px;
  padding: 0 16px;
  border-radius: var(--md-radius-pill);
  background: #F4F5F7;
  transition: background var(--md-dur-fast) var(--md-ease),
              box-shadow var(--md-dur-fast) var(--md-ease);
}
.elementor-element-aad3834 .elementor-icon::after {
  content: "검색어를 입력해주세요.";
  font-size: 13px;
  font-weight: 400;
  letter-spacing: -0.2px;
  color: #8B95A1;
  white-space: nowrap;
}
.elementor-element-aad3834 .elementor-icon svg {
  width: 15px; height: 15px;
  flex-shrink: 0;
}
.elementor-element-aad3834 .elementor-icon svg path { fill: #8B95A1 !important; }
.elementor-element-aad3834 .elementor-icon:hover {
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--md-blue-heavy);
}
/* 좁은 데스크톱에선 검색바 축소 + GNB 간격 압축 (CTA와 겹침 방지) */
@media (min-width: 1025px) and (max-width: 1360px) {
  .elementor-element-aad3834 .elementor-icon { width: 150px; }
  .elementor-element-f814924 .e-n-menu-title { padding: 0 9px !important; margin: 0 3px !important; }
}
/* 모바일에선 아이콘만 + 우측 영역 한 줄 유지 */
@media (max-width: 1024px) {
  .elementor-element-059839a {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 4px;
  }
  .elementor-element-7a812e2 {
    width: 64px !important;
    min-width: 64px !important;
  }
  .elementor-element-aad3834 .elementor-icon {
    width: 40px;
    justify-content: center;
    padding: 0;
    background: transparent;
  }
  .elementor-element-aad3834 .elementor-icon::after { display: none; }
  .elementor-element-aad3834 .elementor-icon svg { width: 18px; height: 18px; }
  .elementor-element-aad3834 .elementor-icon svg path { fill: var(--md-ink-800) !important; }
  .elementor-element-aad3834 .elementor-icon:hover { box-shadow: none; background: var(--md-ink-50); }
}

/* body로 이동된 모바일 드로어는 데스크톱에서 항상 숨김 */
@media (min-width: 1025px) {
  nav.md-drawer { display: none !important; }
}

/* --- 20-3. PC 드롭다운: 클릭 없이 호버로 오픈 ------------------ */
/* 닫힘 = 콘텐츠 내부 e-con display:none → 호버 시 강제 표시 */
@media (min-width: 1025px) {
  .elementor-element-f814924 .e-n-menu-item:hover > .e-n-menu-content > .e-con {
    display: flex !important;
    animation: mdNavFade .18s ease-out both;
  }
}
@keyframes mdNavFade {
  from { opacity: 0; transform: translateY(-5px); }
  to   { opacity: 1; transform: none; }
}

/* --- 20-4. 모바일 햄버거 메뉴 (nav-menu) ---------------------- */
@media (max-width: 1024px) {
  /* 몰 모바일 헤더 패턴: 좌 햄버거 / 중앙 로고 / 우 공식몰·검색 */
  .elementor-element-f6f6c3a { padding-inline: 12px !important; }
  .elementor-element-f6f6c3a > .e-con-inner {
    position: relative;
    min-height: 56px;
    align-items: center;
  }
  /* 로고 — 햄버거 바로 오른쪽 (간격 타이트하게) */
  .elementor-element-2d69a4c {
    position: absolute !important;
    left: 54px;
    top: 50%;
    transform: translateY(-50%);
    width: auto !important;
    max-width: none !important;
  }
  .elementor-element-e889488 img { width: 128px !important; }
  /* 햄버거 위젯 — 좌측 고정 (부모 칼럼의 포지셔닝 컨텍스트 해제 필수) */
  .elementor-element-059839a {
    position: static !important;
    margin-left: auto;
    gap: 0 !important;
    align-items: center !important;
  }
  .elementor-element-7a812e2 { width: 78px !important; min-width: 78px !important; }
  /* 검색 버튼 폭 축소 — 공식몰 필과 바짝 */
  .elementor-element-aad3834 .elementor-icon { width: 34px !important; }
}
/* (제거됨) 초소형 기기 공식몰 숨김 — 로고가 좌측 배치로 바뀌어 겹침 없음.
   갤럭시(360px)에서 공식몰이 사라지던 원인이었음 (07-16) */
@media (max-width: 1024px) {
  .elementor-element-aabaf98 {
    position: absolute !important;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 44px !important;
    max-width: none !important;
  }

  /* 토글 버튼 — CSS 햄버거(가운데 선 짧게, 레퍼런스 반영) + 드롭다운 힌트 화살표 */
  .elementor-element-f6f6c3a .elementor-menu-toggle {
    position: relative;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: transparent;
    color: var(--md-ink-900);
    transition: background var(--md-dur-fast) var(--md-ease);
  }
  .elementor-element-f6f6c3a .elementor-menu-toggle:not(.elementor-active) svg {
    display: none;
  }
  /* 3선 버거: 위/아래 22px, 가운데 14px (좌측 정렬) */
  .elementor-element-f6f6c3a .elementor-menu-toggle:not(.elementor-active)::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -11px;
    transform: translateY(-50%);
    width: 22px;
    height: 17px;
    /* left:50% + margin으로 중앙 배치 */
    background:
      linear-gradient(var(--md-ink-900), var(--md-ink-900)) left top    / 22px 2.4px no-repeat,
      linear-gradient(var(--md-ink-900), var(--md-ink-900)) left center / 14px 2.4px no-repeat,
      linear-gradient(var(--md-ink-900), var(--md-ink-900)) left bottom / 22px 2.4px no-repeat;
  }
  .elementor-element-f6f6c3a .elementor-menu-toggle:hover,
  .elementor-element-f6f6c3a .elementor-menu-toggle.elementor-active {
    background: var(--md-ink-50);
    color: var(--md-ink-900);
  }

  /* 펼침 패널 — 좌측에서 슬라이드되는 드로어 */
  nav.elementor-nav-menu--dropdown.md-drawer {
    display: block !important;            /* 엘리멘터 display 토글 무력화 — transform으로 제어 */
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0;
    width: min(320px, 84vw) !important;
    height: 100dvh !important;
    margin: 0 !important;
    transform: translateX(-105%);
    transition: transform .32s cubic-bezier(.22, 1, .36, 1);
    background: #fff !important;
    border-radius: 0 20px 20px 0;
    box-shadow: 24px 0 48px rgba(25, 31, 40, .16);
    padding: 64px 0 24px;                 /* 상단 여백 = 드로어 헤더 공간 */
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 100001;               /* 헤더(9999)보다 위 */
  }
  .elementor-element-aabaf98 .elementor-menu-toggle.elementor-active + nav.elementor-nav-menu--dropdown,
  body.md-drawer-open nav.elementor-nav-menu--dropdown.md-drawer {
    transform: translateX(0);
  }
  /* 드로어 상단 브랜드 라벨 */
  nav.elementor-nav-menu--dropdown.md-drawer::before {
    content: "MEDI.RETURN LAB";
    position: absolute;
    top: 24px;
    left: 24px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    color: var(--md-ink-300);
  }
  /* 딤 배경 (스크립트가 body에 붙이는 backdrop) */
  .md-drawer-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(25, 31, 40, .42);
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s ease;
    z-index: 100000;               /* 헤더(9999)보다 위 — 열림 시 헤더도 딤 처리 */
  }
  .md-drawer-backdrop.is-open {
    opacity: 1;
    pointer-events: auto;
  }

  /* 1뎁스 항목 */
  nav.elementor-nav-menu--dropdown.md-drawer > ul > li > a.elementor-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    color: var(--md-ink-900) !important;
    letter-spacing: -0.2px;
    background: transparent !important;
  }
  nav.elementor-nav-menu--dropdown.md-drawer > ul > li + li {
    border-top: 1px solid var(--md-ink-50);
  }
  nav.elementor-nav-menu--dropdown.md-drawer a.elementor-item.highlighted,
  nav.elementor-nav-menu--dropdown.md-drawer a.elementor-item:active {
    color: var(--md-blue) !important;
  }
  nav.elementor-nav-menu--dropdown.md-drawer .sub-arrow {
    color: var(--md-ink-300);
  }
  nav.elementor-nav-menu--dropdown.md-drawer .sub-arrow svg {
    width: 14px;
    fill: currentColor;
    transition: transform var(--md-dur) var(--md-ease);
  }
  nav.elementor-nav-menu--dropdown.md-drawer a.highlighted .sub-arrow svg {
    transform: rotate(180deg);
  }

  /* 2뎁스(아코디언) — md-open 클래스로 자체 토글 */
  nav.md-drawer li.menu-item-has-children { position: relative; }
  nav.md-drawer li.menu-item-has-children > a .sub-arrow { display: none !important; }
  /* 펼침 가능 항목 표시 — 아래 화살표 (SVG) */
  nav.md-drawer li.menu-item-has-children > a::after {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    width: 14px;
    height: 14px;
    margin-top: -7px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23B0B8C1" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M6 9l6 6 6-6"/></svg>') center / contain no-repeat;
    opacity: 1 !important;    /* 엘리멘터 포인터 애니메이션이 a::after를 opacity 0으로 깔아둠 */
    transform: none;
    transition: transform var(--md-dur) var(--md-ease);
  }
  nav.md-drawer li.md-open > a::after {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230064FF" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M6 9l6 6 6-6"/></svg>');
    transform: rotate(180deg);
  }
  nav.md-drawer li.md-open > a .elementor-item,
  nav.md-drawer li.md-open > a,
  nav.elementor-nav-menu--dropdown.md-drawer > ul > li.md-open > a.elementor-item {
    color: var(--md-blue) !important;
  }
  nav.md-drawer ul.sub-menu { display: none !important; }
  nav.md-drawer li.md-open > ul.sub-menu { display: block !important; }
  nav.elementor-nav-menu--dropdown.md-drawer ul.sub-menu {
    position: static !important;
    background: var(--md-bg) !important;
    box-shadow: none !important;
    border: none !important;
    padding: 4px 0 8px;
  }
  nav.elementor-nav-menu--dropdown.md-drawer ul.sub-menu a.elementor-sub-item {
    padding: 12px 24px 12px 34px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--md-ink-500) !important;
    letter-spacing: -0.2px;
    background: transparent !important;
  }
  nav.elementor-nav-menu--dropdown.md-drawer ul.sub-menu a.elementor-sub-item:active,
  nav.elementor-nav-menu--dropdown.md-drawer ul.sub-menu a.elementor-sub-item.highlighted {
    color: var(--md-blue) !important;
  }

  /* CTA "피부 진단 받기" — 모바일 메뉴에서 숨김 (사장님 지시 07-15) */
  nav.elementor-nav-menu--dropdown.md-drawer li.menucta {
    display: none !important;
  }
  nav.elementor-nav-menu--dropdown.md-drawer li.menucta + li {
    border-top: none;
  }
}

/* --- 20-2. 푸터 --------------------------------------------- */
.elementor-element-30a858e {
  background: var(--md-bg) !important;
  border-top: 1px solid var(--md-ink-100);
  padding: 48px 24px 56px !important;
}
.elementor-element-30a858e > .e-con-inner {
  max-width: 1200px !important;
  margin: 0 auto;
  row-gap: 8px;
  flex-wrap: wrap !important;
  --flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between !important;
}
/* 좌: 회사정보 늘리고, 우: 소셜 아이콘 */
.elementor-element-30a858e .elementor-element-864b998 { flex: 1 1 auto !important; max-width: 720px; }
.elementor-element-30a858e .elementor-element-ceed32f { flex: 0 0 auto !important; width: auto !important; margin-left: auto; }
/* © 라인 — 몰 푸터와 동일 패턴, 전체 폭 하단 */
.elementor-element-30a858e > .e-con-inner::after {
  content: "© Medi.Return LAB, All Rights Reserved";
  display: block;
  flex-basis: 100%;
  margin-top: 16px;
  font-size: 13px;
  color: var(--md-ink-300);
  letter-spacing: 0;
}
/* 비영리 블로그 푸터 간소화 (사장님 지시 07-15):
   회사명·사업자번호·주소·고객센터 숨김 → 로고 + © + 소셜만 */
.elementor-element-0f70265,
.elementor-element-e51f2a3 { display: none !important; }
/* 메디리턴 랩 로고 */
.elementor-element-30a858e .elementor-element-864b998::before {
  content: "";
  display: block;
  width: 190px;
  height: 18px;
  background: url('/wp-content/uploads/2025/12/%EB%A9%94%EB%94%94%EB%A6%AC%ED%84%B4-%EB%B8%94%EB%A1%9C%EA%B7%B8-%EB%A1%9C%EA%B3%A0-1-scaled.png') left center / contain no-repeat;
}
/* 소셜 아이콘 — 저채도 그레이 원형 */
.elementor-element-f05d0d8 .elementor-social-icon {
  width: 36px !important;
  height: 36px !important;
  background: var(--md-ink-50) !important;
  transition: background var(--md-dur-fast) var(--md-ease),
              transform var(--md-dur-fast) var(--md-ease);
}
.elementor-element-f05d0d8 .elementor-social-icon svg,
.elementor-element-f05d0d8 .elementor-social-icon i {
  fill: var(--md-ink-700) !important;
  color: var(--md-ink-700) !important;
  font-size: 15px !important;
}
.elementor-element-f05d0d8 .elementor-social-icon:hover {
  background: var(--md-blue-soft) !important;
  transform: translateY(-2px);
}
.elementor-element-f05d0d8 .elementor-social-icon:hover svg,
.elementor-element-f05d0d8 .elementor-social-icon:hover i {
  fill: var(--md-blue) !important;
  color: var(--md-blue) !important;
}

/* 모바일 보정 */
@media (max-width: 767px) {
  .home .elementor-element-3ce2059 { padding: 64px 0 0 !important; }
  .home .elementor-element-7bed069 { padding: 64px 0 88px !important; }
  /* 모바일 카드: 풀블리드 방지(좌우 패딩) + 카드 사이 간격 확대 */
  .home .elementor-element-7bed069 > .e-con-inner { padding-inline: 16px !important; }
  .elementor-loop-container:has(> .elementor-88) { gap: 40px 24px !important; }
  .elementor-88.e-loop-item .elementor-element-890e8c1 { padding: 12px 2px 0 !important; }
  .home .elementor-element-e08d276 { padding: 64px 0 72px !important; }
  .home .elementor-element-c3d17f1 { padding: 20px 4px 8px !important; }
  .home .elementor-element-b6e987b .elementor-heading-title { font-size: 22px !important; }
  .home .elementor-element-fa10305 {
    grid-template-columns: repeat(4, max-content) !important;
    gap: 16px 20px !important;
  }
  .home .elementor-element-fa10305 .elementor-widget-image-box .elementor-image-box-img {
    width: 62px; height: 62px;
    border-radius: 19px;               /* skin50 모바일 타일 */
  }
  .home .elementor-element-fa10305 .elementor-widget-image-box .elementor-image-box-img a::before {
    width: 32px; height: 32px;
  }
  /* 히어로: 카드로 띄우고 이미지 → 텍스트 순서 */
  .home .elementor-element-f24ff40 > .e-con-inner { padding-inline: 16px; }
  .home .elementor-element-72c886e { border-radius: 18px !important; }
  /* Elementor 모바일 column-reverse 해제 → 이미지 위, 아이브로우→제목→요약 순 */
  .home .elementor-element-72c886e > .e-con-inner { flex-direction: column !important; }
  .home .elementor-element-72c886e { gap: 0 !important; }
  .home .elementor-element-72c886e > .e-con-inner { gap: 0 !important; }
  .home .elementor-element-72c886e .elementor-element-c3d17f1 { flex-direction: column !important; }
  .home .elementor-element-72c886e .elementor-element-e10436e { order: -1; }
  .home .elementor-element-ac379e7 img { border-radius: 16px !important; }
  /* 더보기 버튼: 모바일에서 풀블리드 → 중앙 정렬 알약 */
  .home .e-loop__load-more { display: flex; justify-content: center; }
  .home .e-loop__load-more .elementor-button { width: auto !important; }
  .home .elementor-element-ac379e7 img { height: auto !important; aspect-ratio: 16/10; object-fit: cover; }
}

/* ============================================================
   21. 글 상세(single) 템플릿 보정
   ============================================================ */

/* --- 검색 결과·본문 추천(템플릿 274) — 배민 카드 문법 --------- */
.elementor-274.e-loop-item,
.elementor-274.e-loop-item:hover,
.elementor-274.e-loop-item [class*="elementor-element"] {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}
.elementor-274.e-loop-item,
.elementor-274.e-loop-item:hover {
  border-radius: 0 !important;
  transform: none !important;
  overflow: visible !important;
}
.elementor-274.e-loop-item,
.elementor-274.e-loop-item > .e-con-inner,
.elementor-274.e-loop-item .elementor-element-82f9fd5,
.elementor-274.e-loop-item .elementor-element-783dfa3 {
  gap: 0 !important;
  min-height: 0 !important;
}
/* 이미지 래퍼(783dfa3)가 라벨의 형제 — 래퍼를 맨 위(-2), 라벨(-1)이 그 아래 */
.elementor-274.e-loop-item .elementor-element-783dfa3 {
  order: -2;
  padding: 0 !important;
  margin-bottom: 14px !important;
}
.elementor-274.e-loop-item .elementor-element-f145fe1 {
  border-radius: 16px;
  overflow: hidden;
}
.elementor-274.e-loop-item .elementor-element-f145fe1 img {
  width: 100% !important;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 16px !important;
  transition: transform .35s ease;
}
.elementor-274.e-loop-item:hover .elementor-element-f145fe1 img {
  transform: scale(1.03);
}
/* 카테고리 라벨 — 블루, 첫 텀만, 제목 위 */
.elementor-274.e-loop-item .elementor-element-8e74b22 { order: -1; padding: 0 !important; margin-bottom: 7px; }
.elementor-274.e-loop-item .elementor-element-8e74b22 .elementor-icon-list-items,
.elementor-274.e-loop-item .elementor-element-8e74b22 .elementor-icon-list-item {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}
.elementor-274.e-loop-item .elementor-element-8e74b22 .elementor-icon-list-text,
.elementor-274.e-loop-item .elementor-element-8e74b22 .elementor-post-info__terms-list {
  background: transparent !important;
  padding: 0 !important;
}
.elementor-274.e-loop-item .elementor-element-8e74b22 .elementor-post-info__terms-list-item,
.elementor-274.e-loop-item .elementor-element-8e74b22 .elementor-icon-list-text > a {
  background: transparent !important;
  padding: 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--md-blue) !important;
}
.elementor-274.e-loop-item .elementor-element-8e74b22 .elementor-post-info__terms-list-item:not(:first-child),
.elementor-274.e-loop-item .elementor-element-8e74b22 .elementor-icon-list-text > a:not(:first-of-type) {
  display: none !important;
}
/* 제목 1줄 · 요약 1줄 */
.elementor-274.e-loop-item .elementor-element-b78eac7 .elementor-heading-title {
  font-size: 19px !important;
  font-weight: 700 !important;
  line-height: 1.42 !important;
  letter-spacing: -1px !important;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.elementor-274.e-loop-item .elementor-element-2e7ec4d,
.elementor-274.e-loop-item .elementor-element-2e7ec4d p {
  font-size: 14.5px !important;
  line-height: 1.55 !important;
  color: var(--md-ink-500) !important;
}
.elementor-274.e-loop-item .elementor-element-2e7ec4d { margin-top: 6px !important; }
.elementor-274.e-loop-item .elementor-element-2e7ec4d,
.elementor-274.e-loop-item .elementor-element-2e7ec4d .elementor-widget-container {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* --- 관련 콘텐츠("이런 콘텐츠 어때요?") — Platum식 화이트 카드 --- */
.elementor-1395.e-loop-item [class*="elementor-element"] {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}
.elementor-1395.e-loop-item {
  position: relative;
  background: #fff !important;
  border: 1px solid var(--md-ink-100) !important;
  border-radius: var(--md-radius-xl) !important;
  box-shadow: var(--md-shadow-1) !important;
  overflow: hidden !important;
  transition: transform var(--md-dur) var(--md-ease),
              box-shadow var(--md-dur) var(--md-ease);
}
.elementor-1395.e-loop-item:hover {
  background: #fff !important;
  border-color: var(--md-ink-100) !important;
  box-shadow: var(--md-shadow-2) !important;
  transform: translateY(-3px);
}
.elementor-1395.e-loop-item > .e-con-inner,
.elementor-1395.e-loop-item .elementor-element-d8e424b,
.elementor-1395.e-loop-item .elementor-element-d8e424b > .e-con-inner,
.elementor-1395.e-loop-item .elementor-element-efce362,
.elementor-1395.e-loop-item .elementor-element-efce362 > .e-con-inner {
  gap: 0 !important;
  row-gap: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}
/* 썸네일 인셋 — 카드 패딩(루트가 아닌 이미지 래퍼 마진) 안에서 자체 라운드 */
.elementor-1395.e-loop-item .elementor-element-f4d5376 {
  border-radius: 14px;
  overflow: hidden;
  margin: 10px 10px 0;
}
.elementor-1395.e-loop-item .elementor-element-f4d5376 img {
  width: 100% !important;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 14px !important;
  transition: transform .35s ease;
}
.elementor-1395.e-loop-item:hover .elementor-element-f4d5376 img {
  transform: scale(1.03);
}
/* 제목 — 2줄 말줄임 + 메타 행(functions.php 주입) */
.elementor-1395.e-loop-item .elementor-element-4fc6999 {
  padding: 16px 22px 18px !important;
}
.elementor-1395.e-loop-item .elementor-element-4fc6999 .elementor-heading-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  letter-spacing: -1px !important;
  color: var(--md-ink-900) !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.9em;
}
/* 카드 메타 행(아바타+작성자·날짜) — functions.php가 1395 제목 위젯 뒤에 주입 */
.md-card-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  letter-spacing: -0.2px;
}
/* ".elementor img { border-radius: 0 }" 리셋(§4)보다 특이도 높여야 원형 유지 */
.md-card-meta .md-card-meta__avatar {
  width: 26px;
  height: 26px;
  border-radius: 50% !important;
  object-fit: cover;
  flex: 0 0 auto;
}
.md-card-meta__avatar--fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--md-blue);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
}
.md-card-meta__name {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--md-ink-800);
}
.md-card-meta__sep {
  font-size: 13px;
  color: var(--md-ink-300);
}
.md-card-meta__date {
  font-size: 13.5px;
  color: var(--md-ink-500);
}
/* 그리드: 배민처럼 3열 × 딱 3개 */
@media (min-width: 768px) {
  .elementor-element-1b5e6d0 .elementor-loop-container {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  /* style 태그가 첫 자식으로 껴 있어 nth-child가 밀림 → div 기준 nth-of-type.
     07-19 사장님 지시로 3개→6개(토스 3×2) — 쿼리도 functions.php에서 6으로 확장 */
  .elementor-element-1b5e6d0 .elementor-loop-container > div.e-loop-item:nth-of-type(n+7) {
    display: none !important;
  }
}

/* --- "이런 콘텐츠 어때요?"부터 회색 밴드 — 본문과 구분 (07-18 사장님 레퍼런스)
   ⚠️272476a는 관련 섹션이 아니라 글 헤더 아래 "본문 전체"를 감싸는 컨테이너
   (통칠하면 본문까지 회색). → 밴드 멤버 3개(헤딩 eab1d01 · 그리드 1b5e6d0 ·
   작성자박스 f29deec)에 box-shadow 100vmax 스프레드 + clip-path 음수 인셋으로
   풀블리드 그레이. 음수 인셋이 멤버 사이 흰 틈(20px/120px/하단 72px)을 메운다.
   초과 블리드는 푸터(불투명 흰 배경)가 덮음 --- */
.single-post .elementor-element-eab1d01,
.single-post .elementor-element-1b5e6d0 {
  background: var(--md-ink-50);
  box-shadow: 0 0 0 100vmax var(--md-ink-50);
}
.single-post .elementor-element-eab1d01 {
  margin-top: 40px !important;
  padding-top: 56px;
  clip-path: inset(0 -100vmax -25px);
}
.single-post .elementor-element-1b5e6d0 {
  clip-path: inset(-25px -100vmax -70px);
}
/* 작성자 박스 — 밴드 위 화이트 카드로 (원래 #FAFAFA 플랫 박스) */
.single-post .elementor-element-f29deec {
  background: #fff !important;
  border: 1px solid var(--md-ink-100);
  border-radius: var(--md-radius-xl);
  padding: 28px !important;
  box-shadow: var(--md-shadow-1), 0 0 0 100vmax var(--md-ink-50);
  clip-path: inset(-70px -100vmax -160px);
}
/* 밴드 위 섹션 헤딩 */
.single-post .elementor-element-eab1d01 .elementor-heading-title {
  font-size: 21px !important;
  font-weight: 700 !important;
  color: var(--md-ink-900) !important;
  letter-spacing: -1px !important;
}
/* 작성자 박스 아바타 — 원형 */
.single-post .elementor-element-f29deec .elementor-author-box__avatar img {
  border-radius: 50%;
  object-fit: cover;
}

/* --- 07-19 관련 섹션 = 토스피드 '연관 콘텐츠' 문법 (사장님 레퍼런스: toss.im/tossfeed) ---
   일반 글: 연회색 풀블리드 밴드(기존 box-shadow/clip-path 메커니즘 유지 — 토스도 회색 구간) 위에
   박스 없는 카드(큰 라운드 썸네일 → 카테고리 → 큰 제목 → 날짜).
   Q&A(.md-qna-post)의 '함께 보면 좋은 질문' 지식인 리스트는 기존 유지. */
.single-post:not(.md-qna-post) .elementor-element-eab1d01 .elementor-heading-title {
  font-size: 24px !important;
  font-weight: 800 !important;
  letter-spacing: -0.8px !important;
  /* DB에 21px 시절 고정 행높이 24px가 박혀 있어 24px 글자가 반쯤 잘림(07-19 사장님 지적) */
  line-height: 1.4 !important;
}
/* 카드 언박싱 — 보더·그림자·배경·리프트 전부 제거 */
.single-post:not(.md-qna-post) .elementor-1395.e-loop-item,
.single-post:not(.md-qna-post) .elementor-1395.e-loop-item:hover {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  transform: none;
}
/* 썸네일 — 컬럼 풀폭 + 큰 라운드 */
.single-post:not(.md-qna-post) .elementor-1395.e-loop-item .elementor-element-f4d5376 {
  margin: 0 !important;
  border-radius: 20px;
}
.single-post:not(.md-qna-post) .elementor-1395.e-loop-item .elementor-element-f4d5376 img {
  border-radius: 20px !important;
}
/* 텍스트 블록 — 카드 패딩 제거, 토스 타이포 스케일 */
.single-post:not(.md-qna-post) .elementor-1395.e-loop-item .elementor-element-4fc6999 {
  padding: 20px 2px 0 !important;
}
.single-post:not(.md-qna-post) .elementor-1395.e-loop-item .elementor-element-4fc6999 .elementor-heading-title {
  font-size: 20px !important;
  line-height: 1.4 !important;
  letter-spacing: -0.6px !important;
  min-height: 0 !important;
}
.md-card-cat {
  font-size: 14.5px;
  color: var(--md-ink-500);
  letter-spacing: -0.3px;
  margin-bottom: 9px;
}
.md-card-date {
  display: block;
  font-size: 14.5px;
  color: var(--md-ink-300);
  letter-spacing: -0.2px;
  margin-top: 11px;
}
/* 대표 이미지 없는 글(히어로 생성 실패 등) — 플레이스홀더로 그리드 리듬 유지 (회색 밴드 위라 흰 블록) */
.single-post:not(.md-qna-post) .elementor-1395.e-loop-item:not(:has(.elementor-element-f4d5376 img))::before {
  content: "";
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  background: #fff;
  border-radius: 20px;
}
/* 컬럼 간격 — 토스처럼 넉넉하게 */
.single-post:not(.md-qna-post) .elementor-element-1b5e6d0 .elementor-loop-container {
  gap: 48px 28px !important;
}
.single-post:not(.md-qna-post) .elementor-element-1b5e6d0 {
  padding-bottom: 40px;
}
/* 모바일 = 토스피드 문법: 2열 그리드 (07-19 사장님 지시 — 1열 스택은 6장이 너무 김) */
@media (max-width: 767px) {
  .single-post:not(.md-qna-post) .elementor-element-1b5e6d0 .elementor-loop-container {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 36px 16px !important;
  }
  .single-post:not(.md-qna-post) .elementor-1395.e-loop-item .elementor-element-f4d5376 {
    border-radius: 14px;
  }
  .single-post:not(.md-qna-post) .elementor-1395.e-loop-item .elementor-element-f4d5376 img {
    border-radius: 14px !important;
    aspect-ratio: 4 / 3 !important; /* 토스 모바일 카드 비율 — 엘리멘터 모바일 높이 지정 무력화 */
    height: auto !important;
    object-fit: cover;
  }
  .single-post:not(.md-qna-post) .elementor-1395.e-loop-item .elementor-element-4fc6999 {
    padding: 12px 1px 0 !important;
  }
  .single-post:not(.md-qna-post) .elementor-1395.e-loop-item .elementor-element-4fc6999 .elementor-heading-title {
    font-size: 15.5px !important;
    line-height: 1.4 !important;
    letter-spacing: -0.4px !important;
    -webkit-line-clamp: 3; /* 좁은 칸이라 3줄까지 허용 (토스도 3줄) */
  }
  .single-post:not(.md-qna-post) .md-card-cat { font-size: 12.5px; margin-bottom: 6px; }
  .single-post:not(.md-qna-post) .md-card-date { font-size: 12.5px; margin-top: 8px; }
}
/* 제목 위 카테고리 — 블루 eyebrow (구분자 텍스트 제거) */
.single-post .elementor-element-6feb8d7 .elementor-icon-list-items,
.single-post .elementor-element-6feb8d7 .elementor-icon-list-text,
.single-post .elementor-element-6feb8d7 .elementor-post-info__terms-list {
  font-size: 0 !important;
  letter-spacing: 0 !important;
}
.single-post .elementor-element-6feb8d7 .elementor-icon-list-items,
.single-post .elementor-element-6feb8d7 .elementor-icon-list-text,
.single-post .elementor-element-6feb8d7 .elementor-post-info__terms-list {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.single-post .elementor-element-6feb8d7 .elementor-post-info__terms-list-item {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--md-blue) !important;
  letter-spacing: -0.2px !important;
}
.single-post .elementor-element-6feb8d7 .elementor-icon-list-icon { display: none !important; }
/* 제목 위 태그 라인은 중복(하단에 칩 있음) → 숨김. "|" 텍스트 위젯도 제거 */
.single-post .elementor-element-83e7ccc,
.single-post .elementor-element-8cdccb1 { display: none !important; }
/* post-info 사이 | 구분자 전역 제거 */
.elementor-widget-post-info .elementor-icon-list-item::after {
  display: none !important;
  content: none !important;
}

/* 날짜 */
.single-post .elementor-element-4ba77b4 .elementor-icon-list-text {
  font-size: 13px !important;
  color: var(--md-ink-500) !important;
}

/* 본문 상단 "피부 진단 받기" — 진단 서비스 준비 전까지 숨김 (07-15) */
.elementor-element-94cadc4 { display: none !important; }
.single-post .elementor-element-94cadc4 { text-align: center; }
.single-post .elementor-element-94cadc4 .elementor-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  height: 48px;
  padding: 0 28px !important;
  border-radius: var(--md-radius-pill) !important;
  background: var(--md-blue) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: -0.2px !important;
  box-shadow: none !important;
  transition: background var(--md-dur-fast) var(--md-ease),
              transform var(--md-dur-fast) var(--md-ease),
              box-shadow var(--md-dur-fast) var(--md-ease);
}
.single-post .elementor-element-94cadc4 .elementor-button:hover {
  background: var(--md-blue-heavy) !important;
  transform: translateY(-1px);
  box-shadow: var(--md-shadow-blue) !important;
}

/* 공유하기 — 아웃라인 알약 */
.single-post .elementor-element-c6464bc { text-align: center; }
.single-post .elementor-element-c6464bc .elementor-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto !important;
  height: 46px;
  padding: 0 26px !important;
  border-radius: var(--md-radius-pill) !important;
  background: var(--md-surface) !important;
  border: 1px solid var(--md-ink-200) !important;
  color: var(--md-ink-800) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  transition: border-color var(--md-dur-fast) var(--md-ease),
              color var(--md-dur-fast) var(--md-ease),
              background var(--md-dur-fast) var(--md-ease);
}
.single-post .elementor-element-c6464bc .elementor-button:hover {
  border-color: var(--md-blue) !important;
  color: var(--md-blue) !important;
  background: #F4F8FF !important;
}
.single-post .elementor-element-c6464bc .elementor-button svg { fill: currentColor !important; width: 15px; }

/* 이전/다음 글 내비 — 회색 알약, 없는 쪽은 숨김 */
.single-post .elementor-widget-post-navigation,
.single-post .elementor-post-navigation,
.single-post .elementor-post-navigation__link {
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
}
.single-post .elementor-post-navigation__link > a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  padding: 0 20px;
  border-radius: var(--md-radius-pill);
  background: var(--md-ink-50);
  color: var(--md-ink-700) !important;
  font-size: 14px;
  font-weight: 600;
  transition: background var(--md-dur-fast) var(--md-ease),
              color var(--md-dur-fast) var(--md-ease);
}
.single-post .elementor-post-navigation__link > a:hover {
  background: var(--md-blue-soft);
  color: var(--md-blue-heavy) !important;
}
.single-post .elementor-post-navigation__link:not(:has(a)) { visibility: hidden; }

/* ============================================================
   22. 피부 사전 허브 (page-skin-dictionary.php) — 닥터나우 벤치마크
   좌측 카테고리 사이드바 + 질문형 리스트 + 하단 고정 CTA
   ============================================================ */
.md-dict {
  max-width: var(--md-container);
  margin: 0 auto;
  padding: 40px 20px 120px; /* 하단 고정 CTA 높이만큼 여유 */
  font-family: var(--md-font-sans);
  letter-spacing: -0.2px;
}
.md-dict__layout {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 48px;
  align-items: start;
}
/* --- 사이드바 --- */
.md-dict__side { position: sticky; top: 90px; }
.md-dict__nav { display: flex; flex-direction: column; gap: 2px; }
.md-dict__nav-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 14px;
  border-radius: var(--md-radius-md);
  font-size: 15px;
  font-weight: 600;
  color: var(--md-ink-700);
  text-decoration: none !important;
  transition: background var(--md-dur-fast) var(--md-ease), color var(--md-dur-fast) var(--md-ease);
}
.md-dict__nav-item:hover { background: var(--md-ink-50); color: var(--md-ink-900); }
.md-dict__nav-item.is-active { background: var(--md-blue-soft); color: var(--md-blue); }
.md-dict__count { font-size: 12.5px; font-weight: 600; color: var(--md-ink-300); }
.md-dict__nav-item.is-active .md-dict__count { color: var(--md-blue); }
.md-dict__side-cta {
  margin-top: 24px;
  padding: 18px 16px;
  border: 1px solid var(--md-ink-100);
  border-radius: var(--md-radius-lg);
  background: #fff;
}
.md-dict__side-cta-title { font-size: 13.5px; color: var(--md-ink-700); margin: 0 0 10px; line-height: 1.5; }
.md-dict__side-cta-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  border-radius: var(--md-radius-sm);
  background: var(--md-blue);
  color: #fff !important;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none !important;
  transition: background var(--md-dur-fast) var(--md-ease);
}
.md-dict__side-cta-btn:hover { background: var(--md-blue-heavy); }
/* --- 본문 --- */
.md-dict__crumb { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--md-ink-500); margin-bottom: 14px; }
.md-dict__crumb a { color: var(--md-ink-500) !important; text-decoration: none !important; }
.md-dict__crumb a:hover { color: var(--md-blue) !important; }
.md-dict__title { font-size: 26px; font-weight: 700; color: var(--md-ink-900); letter-spacing: -1px; margin: 0 0 6px; }
.md-dict__lede { font-size: 15px; color: var(--md-ink-500); margin: 0 0 10px; }
.md-dict__item {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  padding: 24px 0;
  border-bottom: 1px solid var(--md-ink-100);
}
/* 썸네일 — 좌측 고정 폭, 라운드 (사장님 지시: 왼쪽 + border-radius) */
.md-dict__thumb {
  flex: 0 0 168px;
  display: block;
  border-radius: 14px;
  overflow: hidden;
}
.md-dict__thumb img {
  width: 168px !important;
  height: 118px !important;
  object-fit: cover;
  border-radius: 14px !important; /* .elementor img 리셋 방어 */
  display: block;
  transition: transform .35s ease;
}
.md-dict__item:hover .md-dict__thumb img { transform: scale(1.04); }
.md-dict__content { flex: 1 1 auto; min-width: 0; }
.md-dict__item-link { text-decoration: none !important; display: block; }
.md-dict__item-title {
  font-size: 19px;
  font-weight: 700;
  color: var(--md-ink-900);
  letter-spacing: -0.5px;
  line-height: 1.45;
  margin: 0 0 6px;
  transition: color var(--md-dur-fast) var(--md-ease);
}
.md-dict__item-link:hover .md-dict__item-title { color: var(--md-blue); }
.md-dict__item-excerpt {
  font-size: 14.5px;
  color: var(--md-ink-500);
  line-height: 1.6;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.md-dict__item-meta { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.md-dict__chip {
  padding: 4px 10px;
  border-radius: var(--md-radius-sm);
  background: var(--md-ink-50);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--md-ink-700);
}
.md-dict__date { font-size: 12.5px; color: var(--md-ink-300); margin-left: 2px; }
.md-dict__empty { padding: 60px 0; text-align: center; color: var(--md-ink-500); }
/* --- 페이저 --- */
.md-dict__pager { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 32px; }
.md-dict__pager-btn {
  display: inline-flex;
  align-items: center;
  height: 40px;
  padding: 0 18px;
  border-radius: var(--md-radius-pill);
  background: var(--md-ink-50);
  color: var(--md-ink-700) !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
}
.md-dict__pager-btn:hover { background: var(--md-blue-soft); color: var(--md-blue-heavy) !important; }
.md-dict__pager-state { font-size: 13.5px; color: var(--md-ink-500); }
/* --- 하단 고정 CTA = 토스식 플로팅 카드 (07-19 사장님 "힙하게" 지시) --- */
.md-dict__sticky {
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(16px + env(safe-area-inset-bottom));
  z-index: 900;
  padding: 0 16px;
  background: none;
  pointer-events: none;
}
.md-sticky-card {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 560px;
  margin: 0 auto;
  padding: 11px 12px 11px 13px;
  background: rgba(255, 255, 255, .92);
  -webkit-backdrop-filter: blur(14px) saturate(1.6);
  backdrop-filter: blur(14px) saturate(1.6);
  border: 1px solid rgba(13, 26, 60, .07);
  border-radius: 18px;
  box-shadow: 0 16px 40px rgba(13, 26, 60, .16), 0 2px 8px rgba(13, 26, 60, .06);
  animation: md-sticky-in .55s cubic-bezier(.22, 1, .36, 1) both;
  animation-delay: .25s;
}
@keyframes md-sticky-in {
  from { transform: translateY(30px); opacity: 0; }
  to   { transform: none; opacity: 1; }
}
.md-dict__sticky.is-closing .md-sticky-card {
  transition: transform .25s var(--md-ease), opacity .25s var(--md-ease);
  transform: translateY(24px);
  opacity: 0;
}
.md-sticky-card__thumb {
  width: 44px !important;
  height: 44px !important;
  border-radius: 12px !important; /* .elementor img 라운드 리셋 방어 */
  object-fit: cover;
  object-position: center 25%;
  background: var(--md-blue-soft);
  flex: 0 0 auto;
}
.md-sticky-card__text {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.md-sticky-card__eyebrow {
  font-size: 12px;
  letter-spacing: -0.2px;
  color: var(--md-ink-500);
}
.md-sticky-card__title {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.4px;
  color: var(--md-ink-900);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.md-sticky-card__actions { display: flex; gap: 8px; flex: 0 0 auto; }
/* 부모테마 reset의 button hover #c36 함정 — 배경·색 전 상태 명시 */
.md-sticky-card__close {
  height: 42px;
  padding: 0 14px;
  border: none !important;
  border-radius: 12px;
  background: var(--md-ink-50);
  font-family: var(--md-font-sans);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--md-ink-500);
  cursor: pointer;
  transition: background var(--md-dur-fast) var(--md-ease), color var(--md-dur-fast) var(--md-ease);
}
.md-sticky-card__close:hover,
.md-sticky-card__close:focus {
  background: var(--md-ink-100);
  color: var(--md-ink-700);
}
.md-sticky-card__btn {
  display: inline-flex;
  align-items: center;
  height: 42px;
  padding: 0 18px;
  border-radius: 12px;
  background: var(--md-blue);
  color: #fff !important;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: -0.3px;
  text-decoration: none !important;
  transition: background var(--md-dur-fast) var(--md-ease), transform var(--md-dur-fast) var(--md-ease);
}
.md-sticky-card__btn:hover {
  background: var(--md-blue-heavy);
  transform: translateY(-1px);
}
@media (max-width: 640px) {
  .md-dict__sticky { padding: 0 10px; bottom: calc(10px + env(safe-area-inset-bottom)); }
  .md-sticky-card { gap: 10px; padding: 9px 10px; border-radius: 16px; }
  .md-sticky-card__thumb { width: 40px !important; height: 40px !important; }
  .md-sticky-card__eyebrow { display: none; }
  .md-sticky-card__title { font-size: 14px; white-space: normal; line-height: 1.3; }
  .md-sticky-card__close { padding: 0 11px; font-size: 13px; }
  .md-sticky-card__btn { padding: 0 14px; font-size: 13.5px; }
}
/* --- 모바일: 사이드바 → 상단 가로 칩 스크롤 --- */
@media (max-width: 1024px) {
  .md-dict { padding-top: 24px; }
  .md-dict__layout { display: block; }
  .md-dict__side { position: static; margin-bottom: 8px; }
  .md-dict__nav {
    flex-direction: row;
    overflow-x: auto;
    gap: 8px;
    padding-bottom: 8px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .md-dict__nav::-webkit-scrollbar { display: none; }
  .md-dict__nav-item {
    flex: 0 0 auto;
    gap: 6px;
    padding: 9px 14px;
    border-radius: var(--md-radius-pill);
    background: var(--md-ink-50);
    font-size: 14px;
  }
  .md-dict__nav-item.is-active { background: var(--md-blue); color: #fff; }
  .md-dict__nav-item.is-active .md-dict__count { color: rgba(255,255,255,.7); }
  .md-dict__side-cta { display: none; } /* 모바일은 하단 고정 CTA로 충분 */
  .md-dict__title { font-size: 22px; }
  /* 모바일 썸네일 축소 */
  .md-dict__item { gap: 14px; }
  .md-dict__thumb { flex-basis: 108px; }
  .md-dict__thumb img { width: 108px !important; height: 82px !important; }
  .md-dict__item-title { font-size: 16.5px; }
  .md-dict__item-excerpt { -webkit-line-clamp: 2; font-size: 13.5px; }
}

/* ============================================================
   23. 피부 상담소 Q&A — 지식인 문법 (질문 카드 + Q/A 본문 블록)
   숫자(조회·공감·채택)는 실데이터 생기기 전엔 표기하지 않는다
   ============================================================ */
/* --- 허브 질문 카드 --- */
.md-dict__item--qna { gap: 16px; }
.md-qna-badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin-top: 2px;
  border-radius: 50%;
  background: var(--md-blue-soft);
  color: var(--md-blue);
  font-size: 16px;
  font-weight: 800;
}
.md-dict__chip--answered {
  background: var(--md-blue-soft);
  color: var(--md-blue);
}
/* --- 글 페이지: 지식인형 레이아웃 (.md-qna-post = counseling 계열 글) --- */
:root { --qna-accent: var(--md-blue); } /* 지식인 그린으로 바꾸려면 이 한 줄만 */
/* 제목 = 지식인 "Q. 질문" — 좌측 정렬 + Q. 프리픽스 */
.md-qna-post .elementor-element-68504eb { display: none !important; } /* 카테고리 아이브로우 숨김 */
.md-qna-post .elementor-element-7a8ab62,
.md-qna-post .elementor-element-7a8ab62 .elementor-heading-title {
  text-align: left !important; /* 모바일에서 위젯 래퍼가 center라 래퍼까지 강제 */
}
/* 위젯에 박힌 좌우 마진·패딩 5px 제거 — 본문과 좌측 축 통일 */
.md-qna-post .elementor-element-7a8ab62 {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.md-qna-post .elementor-element-7a8ab62 .elementor-heading-title {
  font-size: 26px !important;
  line-height: 1.45 !important;
  letter-spacing: -0.5px !important;
}
.md-qna-post .elementor-element-7a8ab62 .elementor-heading-title::before {
  content: "Q. ";
  color: var(--qna-accent);
  font-weight: 800;
}
.md-qna-post .elementor-element-4ba77b4 .elementor-icon-list-items {
  justify-content: flex-start !important;
}
/* 본문 블록 */
.md-qna { font-family: var(--md-font-sans); letter-spacing: -0.2px; }
/* 질문자 = 지식인 문법 그대로 "제목 밑 메타 한 줄"(질문자명 · 조회수 · 날짜 자리).
   템플릿 날짜 위젯은 숨기고(메타 줄이 날짜 포함) 본문 상단 여백을 당긴다 */
.md-qna-post .elementor-element-4ba77b4 { display: none !important; }
/* 대표 이미지는 og/네이버 썸네일용 자산 — Q&A 화면(지식인 레이아웃)에선 숨김 */
.md-qna-post .elementor-element-c9144ea { display: none !important; }
/* 제목→메타 갭 47px(0높이 형제들의 flex row-gap 누적)을 지식인 밀도로 당김 */
.md-qna-post .elementor-element-3c7c113 { margin-top: -32px !important; }
.md-qna__meta {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: var(--md-ink-500);
  margin-bottom: 24px;
}
.md-qna__meta img {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  object-fit: cover;
  object-position: center 25%;
  background: #EAF4FB;
  flex: 0 0 auto;
}
.md-qna__meta b { color: var(--md-ink-700); font-weight: 600; }
.md-qna__meta .sep { color: var(--md-ink-200); }
.md-qna__q-body {
  font-size: 16px;
  line-height: 1.75;
  color: var(--md-ink-800);
  white-space: pre-line; /* 지식인처럼 1. 2. 3. 줄바꿈 유지 */
}
.md-qna__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.md-qna__tags span {
  padding: 4px 10px;
  border-radius: var(--md-radius-pill);
  background: var(--md-ink-50);
  font-size: 12px;
  font-weight: 500;
  color: var(--md-ink-500);
}
.md-qna__note { margin: 12px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--md-ink-300); }
/* 액션 행 — 지식인 "나도 궁금해요" */
.md-qna__actions { display: flex; gap: 8px; margin-top: 18px; }
.md-qna__react {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 40px;
  padding: 0 16px;
  border: 1px solid var(--md-ink-200);
  border-radius: var(--md-radius-pill);
  background: #fff;
  font-family: var(--md-font-sans);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--md-ink-700);
  cursor: pointer;
  transition: border-color var(--md-dur-fast) var(--md-ease),
              color var(--md-dur-fast) var(--md-ease),
              background var(--md-dur-fast) var(--md-ease);
}
/* 부모테마 reset.css의 button:hover/:focus { background:#c36 }(자홍)가 새는 것 차단 — 배경 명시 필수 */
.md-qna__react:hover,
.md-qna__react:focus {
  background: #fff;
  border-color: var(--qna-accent);
  color: var(--qna-accent);
  text-decoration: none;
}
.md-qna__react.is-done {
  background: var(--md-blue-soft);
  border-color: transparent;
  color: var(--qna-accent);
  cursor: default;
}
.md-qna__react.is-done:hover,
.md-qna__react.is-done:focus {
  background: var(--md-blue-soft);
  border-color: transparent;
  color: var(--qna-accent);
}
.md-qna__cnt { font-weight: 700; }
/* 답변 섹션 — 지식인 문법: 바깥 회색 보더 박스 + "N개 답변" 헤더(하단 구분선) */
.md-qna__divider { height: 1px; background: transparent; margin: 20px 0 0; }
.md-qna__answers {
  margin-top: 20px;
  border: 1px solid var(--md-ink-100);
  border-radius: var(--md-radius-lg);
  background: #fff;
  padding: 26px 28px 30px;
}
.md-qna__answers-head {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--md-ink-900);
  letter-spacing: -0.5px !important;
  margin: 0 0 24px !important;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--md-ink-100);
}
/* 답변 = 지식인 문법: 프로필만 둥근 연회색 블록, 본문은 박스 없이 흰 바탕 */
.md-qna__a { background: transparent; }
.md-qna__a-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: var(--md-ink-50);
  border-radius: var(--md-radius-lg);
}
.md-qna__a-head img {
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  object-fit: cover;
  background: #fff;
}
.md-qna__a-name { font-size: 15.5px; font-weight: 700; color: var(--md-ink-900); display: block; }
.md-qna__a-role {
  display: inline-block;
  margin-top: 5px;
  padding: 2px 9px;
  border: 1px solid var(--md-ink-200);
  border-radius: var(--md-radius-pill);
  background: #fff;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--md-ink-500);
}
/* 프로필 아래 고지 한 줄 — 지식인 "본인 입력 포함 정보" 자리 */
.md-qna__adopted-top {
  margin: 14px 2px 28px;
  font-size: 12.5px;
  color: var(--md-ink-500);
}
.md-qna__adopted-top::before { content: "✔ "; color: var(--qna-accent); font-weight: 700; }
.md-qna__a-core {
  padding: 18px 20px;
  border-radius: var(--md-radius-md);
  background: var(--md-blue-soft);
  font-size: 15.5px;
  font-weight: 600;
  line-height: 1.75;
  color: var(--md-ink-900);
  margin-bottom: 30px;
}
/* 본문 — "엔터 두 번" 리듬(사장님 선호): 문단 사이 넉넉하게 */
.md-qna__a-body { font-size: 16px; line-height: 1.8; color: var(--md-ink-800); }
.md-qna__a-body p { margin: 0 0 30px; }
.md-qna__a-body p:last-child { margin-bottom: 0; }
.md-qna__a-caution {
  margin-top: 30px;
  padding: 14px 18px;
  border-radius: var(--md-radius-md);
  background: #FFF8E9;
  font-size: 13.5px;
  line-height: 1.65;
  color: #8A6D1D;
}
.md-qna__a-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
  padding-top: 16px;
  border-top: 1px solid var(--md-ink-100);
}
.md-qna__a-date { font-size: 12.5px; color: var(--md-ink-300); }
/* --- QnA 글의 하단 관련 섹션 = 지식인 "많이 본 Q&A" 리스트 문법 --- */
/* 헤딩 문구 교체 (Elementor DB 텍스트라 font-size:0 + ::after 패턴) */
.md-qna-post .elementor-element-eab1d01 .elementor-heading-title { font-size: 0 !important; }
.md-qna-post .elementor-element-eab1d01 .elementor-heading-title::after {
  content: "함께 보면 좋은 질문";
  display: block;
  font-size: 21px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: -1px;
  color: var(--md-ink-900);
}
/* 3열 카드 그리드 → 세로 질문 리스트 */
.md-qna-post .elementor-element-1b5e6d0 .elementor-loop-container {
  display: flex !important;
  flex-direction: column;
  gap: 10px !important;
}
.md-qna-post .elementor-1395.e-loop-item .elementor-element-f4d5376 { display: none !important; }
.md-qna-post .elementor-1395.e-loop-item .elementor-element-4fc6999 { padding: 16px 20px !important; }
.md-qna-post .elementor-1395.e-loop-item .elementor-element-4fc6999 .elementor-heading-title {
  min-height: 0 !important;
  -webkit-line-clamp: 1;
  position: relative;
  padding-left: 28px;
  font-size: 16px !important;
}
.md-qna-post .elementor-1395.e-loop-item .elementor-element-4fc6999 .elementor-heading-title::before {
  content: "Q.";
  position: absolute;
  left: 0;
  color: var(--qna-accent);
  font-weight: 800;
}
.md-qna-post .elementor-1395.e-loop-item .md-card-meta { margin-top: 6px; padding-left: 28px; }
/* 하단 작성자 박스 — 답변 프로필 블록과 중복이라 QnA에선 숨김 */
.md-qna-post .elementor-element-f29deec { display: none !important; }
/* 상담소 글만 필터(07-19)라 관련 질문이 0건일 수 있음 — 빈 밴드+헤딩 통째 숨김.
   0건 판정은 서버(body_class 필터의 .md-qna-no-related)가 한다 — :has() 의존 제거
   (07-19 리뷰 픽스: 구형 Safari/Firefox에서 :has() 무시되면 빈 밴드가 노출됐음) */
.md-qna-no-related .elementor-element-1b5e6d0,
.md-qna-no-related .elementor-element-eab1d01 { display: none !important; }

@media (max-width: 1024px) {
  .md-qna-post .elementor-element-7a8ab62 .elementor-heading-title { font-size: 22px !important; }
  /* 모바일 제목 위젯 = 폭 89%+가운데 정렬(Elementor DB)이라 좌측 축이 어긋남
     → 폭 100% + 좌측 고정 + 본문 텍스트 축(컨테이너+7px)에 맞춤 */
  .md-qna-post .elementor-element-7a8ab62 {
    width: 100% !important;
    max-width: 100% !important;
    align-self: flex-start !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
  }
  .md-qna__answers { padding: 18px 16px 22px; }
  .md-qna__a-head { padding: 13px 14px; }
  .md-qna__a-head img { width: 40px !important; height: 40px !important; }
  .md-qna__a-body p { margin-bottom: 24px; }
}

/* ============================================================
   25. 아티클 본문 타이포 = 토스피드 문법 (07-19 사장님 지시)
   autowriter가 인라인 크기(18/24/30px)를 박으므로 속성 셀렉터로
   정밀 타겟 — 바이라인(13px)·CTA박스 등은 안 건드린다. Q&A 제외.
   ============================================================ */
/* 본문 문단: 18 → 17px, 단락 간격 '엔터 두 번' 리듬(30px) */
.single-post:not(.md-qna-post) .elementor-element-3c7c113 p[style*="font-size:18px"] {
  font-size: 17px !important;
  line-height: 1.85 !important;
  letter-spacing: -0.3px;
  margin-bottom: 30px;
  color: var(--md-ink-800);
}
/* 섹션 제목: 형광 마크 제거 → 플레인 잉크 블랙 (토스 문법) */
.single-post:not(.md-qna-post) .elementor-element-3c7c113 h2[style*="font-size:30px"] {
  font-size: 25px !important;
  line-height: 1.45 !important;
  letter-spacing: -0.8px;
}
.single-post:not(.md-qna-post) .elementor-element-3c7c113 h2 mark {
  background: none !important;
  color: var(--md-ink-900) !important;
}
/* 핵심 3줄 요약: 파란 보더 ol → 연회색 라운드 박스 (speedcos 목차 박스 문법) */
.single-post:not(.md-qna-post) .elementor-element-3c7c113 p[style*="font-size:24px"] {
  font-size: 17px !important;
  font-weight: 800;
  letter-spacing: -0.5px;
  color: var(--md-ink-900);
  margin-bottom: 0;
}
.single-post:not(.md-qna-post) .elementor-element-3c7c113 ol[class*="border-color"] {
  border: none !important;
  background: var(--md-ink-50);
  border-radius: 14px;
  padding: 24px 28px 24px 48px !important;
  margin-top: 4px;
}
.single-post:not(.md-qna-post) .elementor-element-3c7c113 ol[class*="border-color"] li {
  font-size: 15.5px !important;
  line-height: 1.9 !important;
  color: var(--md-ink-700);
}
.single-post:not(.md-qna-post) .elementor-element-3c7c113 ol[class*="border-color"] li::marker {
  color: var(--md-blue);
  font-weight: 700;
}
/* 본문 리스트 */
.single-post:not(.md-qna-post) .elementor-element-3c7c113 li[style*="font-size:16px"] {
  font-size: 16px !important;
  line-height: 1.85 !important;
  color: var(--md-ink-800);
}
/* FAQ 블록 */
.single-post:not(.md-qna-post) .rank-math-question {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--md-ink-900);
  margin-bottom: 10px;
}
.single-post:not(.md-qna-post) .rank-math-answer {
  font-size: 16px;
  line-height: 1.8;
  color: var(--md-ink-700);
}
.single-post:not(.md-qna-post) .rank-math-faq-item { margin-bottom: 28px; }

@media (max-width: 1024px) {
  .single-post:not(.md-qna-post) .elementor-element-3c7c113 h2[style*="font-size:30px"] { font-size: 22px !important; }
  .single-post:not(.md-qna-post) .elementor-element-3c7c113 p[style*="font-size:18px"] { font-size: 16.5px !important; }
}

/* --- 폰트 통일 (07-19 스피드 감사): Elementor DB에 Noto Sans KR로 박힌 3곳 →
   Pretendard로 강제. 구글폰트 로드는 functions.php 필터로 차단됨 --- */
.elementor-252 .elementor-element-7a8ab62 .elementor-heading-title,
.elementor-252 .elementor-element-3c7c113,
.elementor-222 .elementor-element-e51f2a3 .elementor-icon-list-item > a,
.elementor-222 .elementor-element-e51f2a3 .elementor-icon-list-text {
  font-family: var(--md-font-sans) !important;
}

/* --- 목차 박스 = speedcos 문법 (💡 목차 + ✓ 앵커, functions.php 자동 생성 — ez-toc 대체) --- */
.md-toc {
  background: var(--md-ink-50);
  border-radius: 14px;
  padding: 26px 30px;
  margin: 8px 0 52px;
}
.md-toc__title {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.3px;
  color: var(--md-ink-900);
  margin-bottom: 14px;
}
.md-toc ul {
  list-style: none;
  margin: 0;
  padding: 0 !important;
}
.md-toc li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 7px;
  font-size: 15.5px;
  line-height: 1.6;
}
.md-toc li:last-child { margin-bottom: 0; }
.md-toc__check { color: var(--md-blue); font-weight: 800; flex: 0 0 auto; }
.md-toc a {
  color: var(--md-ink-700) !important;
  text-decoration: none !important;
  transition: color var(--md-dur-fast) var(--md-ease);
}
.md-toc a:hover { color: var(--md-blue) !important; }
/* 앵커 점프 — 부드럽게. 안착 보정은 JS(functions.php):
   스크롤 시작시 헤더가 fixed로 전환되며 레이아웃이 헤더 높이만큼 당겨져
   CSS(scroll-margin/패딩 기법)로는 정확히 그만큼 오버슈트한다 — 재계측 보정만이 정답 */
html { scroll-behavior: smooth; }
@media (max-width: 1024px) {
  .md-toc { padding: 20px 18px; }
  .md-toc li { font-size: 14.5px; }
}

/* ============================================================
   24. 헤더 상시 고정 + 읽기 진행 바 — 토스피드 문법
   ============================================================ */
/* 스크롤 다운 시 헤더 숨김(she 플러그인 translateY) 무력화 — 토스처럼 항상 보임 */
.she-header-yes.she-header {
  transform: none !important;
}
/* 진행 바 — 헤더 바로 아래 부착(top은 JS가 헤더 높이 실측으로 지정) */
.md-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  z-index: 9998; /* 헤더(9999) 아래, 콘텐츠 위 — 드로어·딤을 가리지 않게 */
  pointer-events: none;
}
.md-progress i {
  display: block;
  height: 100%;
  background: var(--md-blue);
  transform-origin: 0 50%;
  transform: scaleX(0);
}

/* ============================================================
   25. 본문 하이라이트 — 토스피드 문법(뮤트 블루 배경 강조)
   기존 글의 파란 글씨 강조(mark.has-inline-color)도 소급 변환.
   섹션 제목의 회색 mark(has-cyan-bluish-gray-color)는 제외.
   ============================================================ */
.elementor-widget-theme-post-content mark.has-inline-color:not(.has-cyan-bluish-gray-color),
.elementor-widget-theme-post-content mark.md-hl,
.md-qna mark.md-hl {
  background: var(--md-hl-mint) !important;
  color: inherit !important;
  font-weight: 400;
  padding: 1px 3px;
  border-radius: 4px;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

/* ============================================================
   26. 푸터 보강 = 토스 문법 (07-19) — 링크 컬럼 + 브랜드 블록.
   Elementor 푸터 템플릿(로고·SNS·©) 위에 주입됨.
   ============================================================ */
.md-footer {
  border-top: 1px solid var(--md-ink-100);
  background: #fff;
  padding: 56px 24px 0;
}
/* 글 페이지는 위가 회색 밴드(관련 콘텐츠)라 구분선이 이중 — 선 제거, 홈·허브(위가 흰색)만 유지 (07-19 사장님) */
.single-post .md-footer { border-top: none; }
/* 예외: 관련 질문 0건인 QnA 글은 위 회색 밴드가 통째 숨겨져 '선 이중' 전제가 무너짐 —
   흰 본문과 흰 푸터가 맞붙지 않게 구분선 복원 (07-19 리뷰 픽스) */
.single-post.md-qna-no-related .md-footer { border-top: 1px solid var(--md-ink-100); }
/* 기존 Elementor 푸터 템플릿(로고·장식 SNS·©) 숨김 — 새 푸터가 흡수(이중 푸터 꼬임 해소).
   SNS 아이콘 3개는 원래 href 없는 장식이었음 — 실채널 생기면 새 푸터에 추가.
   ⚠️템플릿 래퍼는 div가 아니라 <footer> 태그 */
.elementor-222.elementor-location-footer,
footer.elementor-222 { display: none !important; }
.md-footer__bottom {
  margin-top: 40px;
  padding: 22px 0 36px;
  border-top: 1px solid var(--md-ink-100);
}
/* 스티키 CTA가 뜨는 페이지(md-footer--pad, PHP가 판단) — 고정 카드가 ©행·시그니처를
   가리지 않게 하단 여백 확보 (07-19 리뷰 픽스) */
.md-footer--pad .md-footer__bottom { padding-bottom: 104px; }
@media (max-width: 767px) {
  .md-footer--pad .md-footer__bottom { padding-bottom: 96px; }
}
.md-footer__copy {
  font-size: 13px;
  letter-spacing: -0.1px;
  color: var(--md-ink-300);
}
.md-footer__inner { max-width: 1200px; margin: 0 auto; } /* 기존 푸터 로고 행과 좌측 축 정렬 */
.md-footer__cols { display: flex; gap: 96px; flex-wrap: wrap; }
.md-footer__col { display: flex; flex-direction: column; gap: 13px; }
.md-footer__head {
  font-size: 14.5px;
  font-weight: 700;
  letter-spacing: -0.3px;
  color: var(--md-ink-900);
  margin-bottom: 5px;
}
.md-footer__col a {
  font-size: 14px;
  letter-spacing: -0.2px;
  color: var(--md-ink-500) !important;
  text-decoration: none !important;
  transition: color var(--md-dur-fast) var(--md-ease);
}
.md-footer__col a:hover { color: var(--md-ink-900) !important; }
.md-footer__brand { margin-top: 48px; }
.md-footer__name {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.3px;
  color: var(--md-ink-900);
  margin-bottom: 10px;
}
.md-footer__desc {
  font-size: 13.5px;
  line-height: 1.75;
  color: var(--md-ink-500);
  margin: 0 0 8px;
  word-break: keep-all;
}
.md-footer__desc strong { color: var(--md-ink-700); }
.md-footer__notice {
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--md-ink-300);
  margin: 0;
}
/* 브랜드 시그니처 — Return your confidence. (07-19 브랜드 컨셉) */
.md-footer__sign {
  margin: 22px 0 0;
  font-size: 14px;
  letter-spacing: 0.01em;
  color: var(--md-ink-500);
}
.md-footer__sign strong {
  color: var(--md-blue);
  font-weight: 700;
}
@media (max-width: 767px) {
  .md-footer { padding: 44px 20px 4px; }
  .md-footer__cols { gap: 36px 48px; }
  .md-footer__brand { margin-top: 36px; }
}

/* ============================================================
   18. Print
   ============================================================ */
@media print {
  .site-header, .site-footer, .comments-area, .nav-links { display: none !important; }
  body { color: #000; background: #fff; }
  a { color: #000; text-decoration: underline; }
}