@charset "utf-8";
/* ==========================================================================
   제품픽 V10 — Design System
   컨셉: "검수 대장(臺帳)" — 가로 괘선이 흐르는 짙은 그린 지면 위에
        흰 종이 카드가 놓인 문서형 레이아웃. 확인일·출처가 항상 눈에 보인다.
   구조: 1) 토큰  2) 리셋·타이포  3) 헤더/푸터  4) 홈  5) 카테고리
        6) 제품 상세  7) 사이드/모바일 바  8) 공용  9) 반응형  10) 접근성
   반응형: 데스크톱 우선 → 1080px(태블릿·1단) → 780px(모바일) → 430px(소형)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 디자인 토큰
   -------------------------------------------------------------------------- */
:root {
  /* 색 — 로고(짙은 그린 + 골드)에서 파생 */
  --paper: #ffffff;
  --bg: #f2f3ef;
  --bg-2: #e9ebe4;
  --ink: #14201c;
  --ink-2: #37473f;
  --muted: #6b7a73;
  --muted-2: #8a978f;

  --brand: #0b5344;
  --brand-2: #083b31;
  --brand-3: #052620;
  --brand-tint: #e7efeb;
  --brand-tint-2: #d5e3dc;

  --gold: #9a6f22;
  --gold-2: #c79a45;
  --gold-tint: #fbf2df;

  --line: #e0e4dd;
  --line-2: #c9d1c9;
  --danger: #9b3b2f;

  --text-on-dark: #f4f8f5;
  --text-on-dark-muted: #bfd3cb;

  /* 레이아웃 */
  --content: 1200px;
  --article: 820px;
  --aside: 328px;
  --gutter: 32px;
  --header-h: 74px;

  /* 형태 */
  --r-xs: 8px;
  --r-sm: 12px;
  --r: 16px;
  --r-lg: 22px;

  --shadow-1: 0 1px 2px rgba(16, 32, 27, .04), 0 10px 26px -14px rgba(16, 32, 27, .22);
  --shadow-2: 0 2px 4px rgba(16, 32, 27, .05), 0 22px 50px -22px rgba(16, 32, 27, .3);
  --shadow-dark: 0 24px 60px -24px rgba(5, 38, 32, .55);

  /* 서체 */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
  --font-serif: "Nanum Myeongjo", "Noto Serif KR", "Batang", "Apple SD Gothic Neo", Georgia, serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;

  /* 시그니처: 괘선 텍스처 */
  --rule-dark: repeating-linear-gradient(180deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 34px);
  --rule-light: repeating-linear-gradient(180deg, rgba(11, 83, 68, .05) 0 1px, transparent 1px 34px);
}

/* --------------------------------------------------------------------------
   2. 리셋 · 기본 타이포그래피
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 16px);
}

html, body { width: 100%; max-width: 100%; overflow-x: clip; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: 16px;
  font-weight: 450;
  line-height: 1.75;
  letter-spacing: -.015em;
  word-break: keep-all;
  overflow-wrap: anywhere;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
img, svg, video { max-width: 100%; }
img { height: auto; }
[hidden] { display: none !important; }

h1, h2 {
  font-family: var(--font-serif);
  font-weight: 700;
  letter-spacing: -.035em;
  line-height: 1.32;
  text-wrap: balance;
  margin: 0;
}

h3, h4 {
  font-family: var(--font-sans);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.45;
  margin: 0;
}

p { margin: 0 0 16px; }
p:last-child { margin-bottom: 0; }

/* 숫자는 언제나 표(表)처럼 정렬 */
strong, b, time, del, dd, .price-panel, .quick-facts, .summary-grid { font-variant-numeric: tabular-nums; }

/* 대문자 라벨 — 문서의 항목 머리표 */
.eyebrow {
  display: block;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
}

/* 어두운 면 위에서는 밝은 골드로 */
.hero .eyebrow, .direct-answer .eyebrow, .trust-grid .eyebrow { color: var(--gold-2); }

.muted { color: var(--muted) !important; }
.compact-note { margin-top: 14px !important; font-size: 13px !important; line-height: 1.7 !important; color: var(--muted) !important; }

/* --------------------------------------------------------------------------
   3. 헤더 · 내비게이션 · 푸터
   -------------------------------------------------------------------------- */
.skip-link {
  position: fixed; left: 12px; top: -80px; z-index: 9999;
  padding: 11px 16px; background: var(--paper); color: var(--ink);
  border: 1px solid var(--line-2); border-radius: var(--r-sm); font-size: 14px; font-weight: 700;
}
.skip-link:focus { top: 12px; }

.reading-progress {
  position: fixed; z-index: 999; top: 0; left: 0; width: 100%; height: 2px;
  background: linear-gradient(90deg, var(--brand), var(--gold-2));
  transform: scaleX(0); transform-origin: left;
}

.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: saturate(150%) blur(14px);
  border-bottom: 1px solid var(--line);
}

.header-inner {
  width: 100%; max-width: calc(var(--content) + var(--gutter) * 2);
  height: var(--header-h); margin-inline: auto; padding-inline: var(--gutter);
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
}

.brand { display: flex; align-items: center; gap: 11px; min-width: 0; }
.brand img { width: 38px; height: 38px; border-radius: 10px; }
.brand span { display: grid; min-width: 0; }
.brand strong { font-family: var(--font-serif); font-size: 20px; font-weight: 700; letter-spacing: -.04em; color: var(--brand-2); }
.brand small { font-size: 11px; color: var(--muted); letter-spacing: -.01em; }

.site-header nav { display: flex; align-items: center; gap: 6px; }
.site-header nav a {
  position: relative; padding: 9px 12px; border-radius: var(--r-xs);
  font-size: 14px; font-weight: 600; color: var(--ink-2);
  transition: color .18s ease, background .18s ease;
}
.site-header nav a:hover { color: var(--brand); background: var(--brand-tint); }
.site-header nav a[aria-current="page"] { color: var(--brand); font-weight: 700; }
.site-header nav a[aria-current="page"]::after {
  content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px;
  height: 2px; border-radius: 2px; background: var(--gold-2);
}

.nav-toggle {
  display: none; width: 42px; height: 42px; padding: 0;
  background: transparent; border: 1px solid var(--line); border-radius: var(--r-xs); cursor: pointer;
}
.nav-toggle span { display: block; width: 18px; height: 1.5px; margin: 4px auto; border-radius: 2px; background: var(--ink); }

.site-footer {
  margin-top: 80px; padding: 64px var(--gutter) 32px;
  background: var(--brand-3); background-image: var(--rule-dark);
  color: var(--text-on-dark);
  content-visibility: auto; contain-intrinsic-size: 640px;
}
.footer-inner { max-width: var(--content); margin-inline: auto; }
.footer-brand { display: flex; align-items: center; gap: 14px; padding-bottom: 28px; border-bottom: 1px solid rgba(255, 255, 255, .14); }
.footer-brand img { width: 44px; height: 44px; border-radius: 11px; }
.footer-brand strong { font-family: var(--font-serif); font-size: 19px; }
.footer-brand p { margin: 3px 0 0; font-size: 13px; color: var(--text-on-dark-muted); }
.footer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; padding: 32px 0; }
.footer-grid > div { display: grid; align-content: start; gap: 10px; }
.footer-grid b { font-family: var(--font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-2); }
.footer-grid a { font-size: 14px; color: var(--text-on-dark-muted); transition: color .18s ease; }
.footer-grid a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.footer-bottom {
  display: flex; justify-content: space-between; gap: 16px;
  padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, .14);
  font-size: 12px; color: rgba(191, 211, 203, .8);
}

/* --------------------------------------------------------------------------
   4. 홈 — 히어로 · 분야 · 목록 · 신뢰
   -------------------------------------------------------------------------- */
.content-shell, .article-shell {
  width: 100%; max-width: calc(var(--content) + var(--gutter) * 2);
  margin-inline: auto; padding-inline: var(--gutter);
}

.hero {
  position: relative; overflow: hidden;
  background-color: var(--brand-3);
  background-image:
    radial-gradient(90% 70% at 84% 0%, rgba(199, 154, 69, .22), transparent 62%),
    radial-gradient(70% 60% at 0% 100%, rgba(11, 83, 68, .55), transparent 60%),
    var(--rule-dark);
  color: var(--text-on-dark);
}
.hero-inner {
  position: relative; z-index: 1;
  width: 100%; max-width: calc(var(--content) + var(--gutter) * 2);
  margin-inline: auto; padding: 86px var(--gutter);
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
  gap: 64px; align-items: center;
}
.hero-copy { min-width: 0; }
.hero h1 {
  margin: 18px 0 20px;
  font-size: clamp(38px, 4.6vw, 62px);
  font-weight: 800; line-height: 1.22; letter-spacing: -.045em;
  color: #fff;
}
.hero-copy > p { max-width: 46em; margin: 0 0 28px; font-size: 17px; line-height: 1.8; color: var(--text-on-dark-muted); }

.search-box {
  display: flex; align-items: center; gap: 12px;
  max-width: 620px; height: 62px; padding: 0 18px;
  background: var(--paper); border: 1px solid transparent; border-radius: var(--r);
  box-shadow: var(--shadow-dark);
  transition: border-color .18s ease, box-shadow .18s ease;
}
.search-box svg { flex: 0 0 20px; width: 20px; height: 20px; fill: none; stroke: var(--brand); stroke-width: 1.9; }
.search-box input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 16px; }
.search-box input::placeholder { color: var(--muted-2); }
.search-box:focus-within { border-color: var(--gold-2); box-shadow: var(--shadow-dark), 0 0 0 4px rgba(199, 154, 69, .22); }

.hero-trust { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.hero-trust span {
  padding: 7px 12px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 999px;
  background: rgba(255, 255, 255, .06); font-size: 12px; color: var(--text-on-dark-muted);
}

/* 현황 카드 — 유리판이 아니라 '명세서'처럼 */
.hero-summary {
  padding: 26px; border: 1px solid rgba(255, 255, 255, .18); border-radius: var(--r-lg);
  background: rgba(255, 255, 255, .06); box-shadow: var(--shadow-dark);
}
.summary-primary { display: flex; align-items: baseline; gap: 8px; padding-bottom: 20px; border-bottom: 1px solid rgba(255, 255, 255, .16); }
.summary-primary small { margin-right: auto; font-size: 12px; letter-spacing: .04em; color: var(--text-on-dark-muted); }
.summary-primary strong { font-family: var(--font-serif); font-size: 52px; font-weight: 700; line-height: 1; letter-spacing: -.05em; color: #fff; }
.summary-primary span { font-size: 14px; color: var(--text-on-dark-muted); }
.summary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 20px; background: rgba(255, 255, 255, .16); border-radius: var(--r-sm); overflow: hidden; }
.summary-grid div { display: grid; gap: 3px; padding: 16px 18px; background: var(--brand-3); }
.summary-grid b { font-size: 22px; font-weight: 700; color: #fff; }
.summary-grid small { font-size: 11px; color: var(--text-on-dark-muted); }

/* 섹션 머리 */
.category-overview, .listing-section { padding: 72px 0; }
.section-heading, .listing-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 26px; }
.section-heading h2, .listing-head h2 { margin: 10px 0 6px; font-size: clamp(26px, 3vw, 38px); }
.section-heading p, .listing-head p { margin: 0; font-size: 15px; color: var(--muted); }
.listing-head > strong {
  flex: 0 0 auto; padding: 8px 14px; border: 1px solid var(--brand-tint-2); border-radius: 999px;
  background: var(--brand-tint); color: var(--brand); font-size: 13px; font-weight: 700;
}

/* 분야 카드 */
.category-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 12px; }
.category-card {
  display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; gap: 16px;
  padding: 18px 20px; border: 1px solid var(--line); border-radius: var(--r);
  background: var(--paper); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.category-card:hover { transform: translateY(-2px); border-color: var(--brand-tint-2); box-shadow: var(--shadow-1); }
.category-symbol {
  display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px;
  background: var(--brand-tint); color: var(--brand); font-size: 22px;
}
.category-card strong { font-size: 16px; font-weight: 700; }
.category-card p { margin: 2px 0 0; font-size: 12.5px; color: var(--muted); }
.category-card > b {
  display: grid; place-items: center; min-width: 34px; height: 30px; padding: 0 9px; border-radius: 999px;
  background: var(--bg-2); color: var(--ink-2); font-size: 13px; font-weight: 700;
}

/* 필터 */
.filter-row {
  display: flex; gap: 8px; margin-bottom: 22px; padding-bottom: 6px;
  overflow-x: auto; scrollbar-width: thin; scrollbar-color: var(--line-2) transparent;
}
.filter-row button {
  flex: 0 0 auto; padding: 9px 15px; border: 1px solid var(--line-2); border-radius: 999px;
  background: var(--paper); color: var(--ink-2); font-size: 13.5px; font-weight: 600; cursor: pointer;
  transition: background .16s ease, color .16s ease, border-color .16s ease;
}
.filter-row button:hover { border-color: var(--brand); color: var(--brand); }
.filter-row button.active { background: var(--brand); border-color: var(--brand); color: #fff; }

/* 제품 카드 */
.product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 306px), 1fr)); gap: 20px; }
.product-card { min-width: 0; }
.product-card > a {
  height: 100%; display: flex; flex-direction: column; overflow: hidden;
  border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper);
  box-shadow: var(--shadow-1);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.product-card > a:hover { transform: translateY(-4px); border-color: var(--brand-tint-2); box-shadow: var(--shadow-2); }

.card-visual {
  position: relative; aspect-ratio: 4 / 3; padding: 18px;
  display: flex; align-items: flex-start; justify-content: space-between;
  background-color: var(--bg-2);
  background-image: radial-gradient(80% 70% at 78% 12%, rgba(199, 154, 69, .16), transparent 60%), var(--rule-light);
  border-bottom: 1px solid var(--line);
}
.card-visual > span {
  display: grid; place-items: center; width: 54px; height: 54px; border-radius: 15px;
  background: var(--paper); color: var(--brand); font-size: 25px; box-shadow: var(--shadow-1);
}
.card-visual small {
  flex: 0 0 auto; margin-left: auto; padding: 5px 10px; border: 1px solid var(--brand-tint-2); border-radius: 999px;
  background: rgba(255, 255, 255, .82); color: var(--brand); font-size: 11px; font-weight: 700;
}
.card-visual.has-product-image { display: block; padding: 20px; }
.card-visual.has-product-image img {
  display: block; width: 100%; height: 100%; object-fit: contain;
  filter: drop-shadow(0 14px 20px rgba(16, 32, 27, .14));
}
.card-visual.has-product-image small { position: absolute; right: 14px; top: 14px; }

.card-content { display: flex; flex-direction: column; flex: 1; padding: 20px; }
.card-meta { display: flex; justify-content: space-between; gap: 10px; font-size: 11.5px; color: var(--muted); }
.card-meta time { font-family: var(--font-mono); font-size: 11px; color: var(--muted-2); }
.card-content h2 {
  margin: 10px 0 7px; font-family: var(--font-sans); font-size: 18px; font-weight: 700;
  line-height: 1.45; letter-spacing: -.035em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.card-content > p { margin: 0 0 20px; font-size: 13px; line-height: 1.65; color: var(--muted); }
.card-bottom { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--line); }
.card-bottom strong { font-size: 18px; font-weight: 800; letter-spacing: -.03em; }
.card-bottom span { font-size: 12.5px; font-weight: 700; color: var(--brand); }
.card-bottom b { transition: transform .2s ease; display: inline-block; }
.product-card > a:hover .card-bottom b { transform: translateX(3px); }

.empty-state { padding: 72px 20px; text-align: center; color: var(--muted); }
.empty-state strong { display: block; margin-bottom: 6px; font-size: 17px; color: var(--ink); }

/* 편집 기준 */
.trust-section {
  padding: 84px 0; background-color: var(--brand-2); background-image: var(--rule-dark);
  color: var(--text-on-dark);
}
.trust-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 64px; align-items: center; }
.trust-grid h2 { margin: 12px 0 14px; font-size: clamp(28px, 3.2vw, 40px); color: #fff; }
.trust-grid > div > p { margin: 0; color: var(--text-on-dark-muted); }
.trust-grid > div > a { display: inline-flex; gap: 6px; margin-top: 16px; color: var(--gold-2); font-size: 14px; font-weight: 700; }
.trust-grid > div > a:hover { text-decoration: underline; text-underline-offset: 4px; }
.trust-points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.trust-points article { padding: 22px; border: 1px solid rgba(255, 255, 255, .14); border-radius: var(--r); background: rgba(255, 255, 255, .05); }
.trust-points b { font-family: var(--font-mono); font-size: 12px; letter-spacing: .12em; color: var(--gold-2); }
.trust-points strong { display: block; margin: 14px 0 7px; font-size: 15px; color: #fff; }
.trust-points p { margin: 0; font-size: 13px; line-height: 1.7; color: var(--text-on-dark-muted); }

/* --------------------------------------------------------------------------
   5. 카테고리 페이지
   -------------------------------------------------------------------------- */
.breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; padding: 18px 0; font-size: 12.5px; color: var(--muted); }
.breadcrumb a:hover { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }
.breadcrumb strong { font-weight: 600; color: var(--ink-2); }

.category-hero {
  background-color: var(--bg-2);
  background-image: radial-gradient(70% 80% at 88% 0%, rgba(199, 154, 69, .16), transparent 60%), var(--rule-light);
  border-bottom: 1px solid var(--line);
}
.category-hero-inner { display: grid; grid-template-columns: 84px minmax(0, 1fr) auto; align-items: center; gap: 24px; padding: 34px 0 44px; }
.category-hero-symbol { display: grid; place-items: center; width: 84px; height: 84px; border-radius: 22px; background: var(--paper); color: var(--brand); font-size: 36px; box-shadow: var(--shadow-1); }
.category-hero h1 { margin: 10px 0 8px; font-size: clamp(28px, 3.4vw, 42px); }
.category-hero p { max-width: 62ch; margin: 0; font-size: 15px; color: var(--ink-2); }
.category-hero-inner > strong { font-family: var(--font-serif); font-size: 46px; line-height: 1; letter-spacing: -.05em; color: var(--brand); text-align: right; }
.category-hero-inner > strong small { display: block; margin-top: 8px; font-family: var(--font-sans); font-size: 12px; letter-spacing: 0; color: var(--muted); }

/* --------------------------------------------------------------------------
   6. 제품 상세 — 본문
   -------------------------------------------------------------------------- */
.product-layout { display: grid; grid-template-columns: minmax(0, 1fr) var(--aside); gap: 32px; align-items: start; padding-bottom: 40px; }
.product-layout>*{min-width:0}

.article {
  position: relative; min-width: 0; max-width: 100%; overflow: hidden;
  padding: 46px 50px 52px; border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--paper); box-shadow: var(--shadow-1);
}
.article h1, .article h2, .article h3, .article p, .article li, .article dt, .article dd, .article summary, .article strong, .article span, .article a { overflow-wrap: anywhere; word-break: keep-all; }

.compensation-disclosure {
  margin: 4px 0 14px; padding: 12px 16px; border: 1px solid #e3d3ae; border-radius: var(--r-sm);
  background: var(--gold-tint); color: #6d5220; font-size: 13px; font-weight: 600; text-align: center;
}

/* 머리말 */
.article-header { padding-bottom: 30px; border-bottom: 2px solid var(--ink); }
.article-labels { display: flex; flex-wrap: wrap; gap: 7px; }
.status-badge, .availability { padding: 6px 11px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.status-badge { background: var(--brand-tint); color: var(--brand); }
.availability { background: var(--gold-tint); color: #7c5c1c; }
.article-header h1 { margin: 18px 0 16px; font-size: clamp(30px, 3.6vw, 46px); font-weight: 800; line-height: 1.28; }
.article-lead { max-width: 64ch; margin: 0; font-size: 17px; line-height: 1.9; color: var(--ink-2); }

.article-byline { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 22px; font-size: 12px; }
.article-byline a { padding: 5px 11px; border: 1px solid var(--brand-tint-2); border-radius: 999px; background: var(--brand-tint); color: var(--brand); font-weight: 700; }
.article-byline span { padding: 5px 11px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); }
/* 시그니처: 확인 스탬프 */
.article-byline span:first-of-type { border-color: #e3d3ae; background: var(--gold-tint); color: #7c5c1c; font-weight: 600; }

/* 핵심 수치 3칸 */
.article-hero-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 24px; }
.article-hero-facts > div { position: relative; padding: 16px 18px 16px 20px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--bg); }
.article-hero-facts > div::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px; border-radius: 0 3px 3px 0; background: var(--gold-2); }
.article-hero-facts small { display: block; margin-bottom: 5px; font-size: 12px; font-weight: 600; color: var(--muted); }
.article-hero-facts strong { display: block; font-size: 17px; font-weight: 800; letter-spacing: -.03em; }
.article-hero-facts del { display: block; margin-top: 3px; font-size: 12px; color: var(--muted-2); }
.article-hero-facts span { display: block; margin-top: 4px; font-size: 12px; line-height: 1.5; color: var(--muted); }

/* 대표 이미지 */
.product-main-image { margin: 30px 0 34px; }
.product-image-frame {
  aspect-ratio: 1 / 1; display: grid; place-items: center; overflow: hidden;
  border: 1px solid var(--line); border-radius: var(--r-lg);
  background-color: var(--bg-2); background-image: var(--rule-light);
}
.product-image-frame img { width: 100%; height: 100%; object-fit: contain; }
.product-main-image figcaption { margin-top: 10px; font-size: 12px; text-align: center; color: var(--muted); }

/* 외부 평점 */
.external-rating {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 6px 22px;
  margin: 24px 0 6px; padding: 20px 22px; border: 1px solid #e3d3ae; border-radius: var(--r);
  background: var(--gold-tint);
}
.external-rating > div { grid-row: 1 / 3; display: flex; align-items: baseline; gap: 12px; white-space: nowrap; }
.external-rating > div > span { font-size: 12px; font-weight: 700; color: #7c5c1c; }
.external-rating strong { font-family: var(--font-serif); font-size: 30px; letter-spacing: -.04em; color: var(--brand); }
.external-rating strong small { font-family: var(--font-sans); font-size: 13px; color: var(--muted); }
.external-rating p { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink-2); }
.external-rating > small { font-size: 11.5px; line-height: 1.6; color: var(--muted); }

/* 핵심 요약 — 어두운 블록 1 */
.direct-answer {
  position: relative; overflow: hidden; margin: 30px 0 22px; padding: 30px 32px;
  border-radius: var(--r-lg); border: 0;
  background-color: var(--brand-2);
  background-image: radial-gradient(80% 90% at 92% 4%, rgba(199, 154, 69, .2), transparent 58%), var(--rule-dark);
  color: var(--text-on-dark); box-shadow: var(--shadow-1);
}
.direct-answer h2 { margin: 10px 0 12px; font-size: clamp(21px, 2.3vw, 27px); color: #fff; }
.direct-answer > p { max-width: 66ch; margin: 0; font-size: 15.5px; line-height: 1.9; color: var(--text-on-dark-muted); }
.takeaway-list { display: grid; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.takeaway-list li {
  position: relative; padding: 12px 16px 12px 38px; border: 1px solid rgba(255, 255, 255, .14); border-radius: var(--r-sm);
  background: rgba(255, 255, 255, .06); font-size: 14.5px; line-height: 1.65; color: #fff;
}
.takeaway-list li::before {
  content: "✓"; position: absolute; left: 14px; top: 12px;
  color: var(--gold-2); font-size: 13px; font-weight: 700;
}

/* 요약 수치 */
.quick-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 20px 0 30px; }
.quick-facts > div { padding: 17px 18px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--bg); }
.quick-facts span { display: block; margin-bottom: 6px; font-size: 12px; color: var(--muted); }
.quick-facts strong { display: block; font-size: 16px; font-weight: 700; line-height: 1.45; }
.quick-facts small { display: block; margin-top: 6px; font-size: 11.5px; line-height: 1.55; color: var(--muted-2); }

/* 목차 */
.table-of-contents {
  display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 20px;
  margin: 26px 0 44px; padding: 22px 24px;
  border-top: 2px solid var(--ink); border-bottom: 1px solid var(--line); background: var(--bg);
}
.table-of-contents > strong { font-family: var(--font-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }
.table-of-contents ol { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 24px; margin: 0; padding-left: 18px; }
.table-of-contents li::marker { color: var(--muted-2); font-size: 12px; }
.table-of-contents a { font-size: 13.5px; line-height: 1.6; color: var(--ink-2); }
.table-of-contents a:hover { color: var(--brand); text-decoration: underline; text-underline-offset: 4px; }
.table-of-contents a.is-current { color: var(--brand); font-weight: 700; }

/* 본문 섹션 — 괘선으로 구분되는 문서 리듬 */
.article-section { margin: 0; padding: 44px 0; border-top: 1px solid var(--line); scroll-margin-top: calc(var(--header-h) + 20px); }
.table-of-contents + .article-section { padding-top: 0; border-top: 0; }
#price h3 { margin: 26px 0 10px; font-size: 17px; }
.section-title { display: grid; gap: 12px; margin-bottom: 22px; }
.section-title > span {
  display: flex; align-items: center; gap: 12px;
  font-family: var(--font-mono); font-size: 12px; font-weight: 600; letter-spacing: .16em;
  text-transform: uppercase; color: var(--gold);
}
.section-title > span::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.section-title h2 { font-size: clamp(23px, 2.6vw, 31px); }
.article-section > p, .longform-sections p, .detail-blocks p { max-width: 68ch; font-size: 16px; line-height: 1.95; color: var(--ink-2); }
.paragraph-note { display: block; margin-top: 10px; padding-left: 12px; border-left: 2px solid var(--line-2); font-size: 12.5px; line-height: 1.7; color: var(--muted); }

.longform-sections { display: grid; gap: 16px; }
.longform-sections > section { padding: 26px 28px; border: 1px solid var(--line); border-radius: var(--r); background: var(--bg); }
.longform-sections h3, .detail-blocks h3 { margin: 0 0 12px; font-size: 19px; }
.detail-blocks { display: grid; gap: 12px; }
.detail-blocks > div { padding: 22px 24px; border-left: 3px solid var(--brand); border-radius: 0 var(--r-sm) var(--r-sm) 0; background: var(--bg); }
.notice-box { margin-top: 16px; padding: 18px 20px; border: 1px solid #e3d3ae; border-radius: var(--r-sm); background: var(--gold-tint); }
.notice-box strong { font-size: 13.5px; color: #6d5220; }
.notice-box p { margin: 5px 0 0; font-size: 13.5px; color: var(--ink-2); }

/* 특징 카드 */
.feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.feature-grid article { padding: 22px 24px; border: 1px solid var(--line); border-radius: var(--r); background: var(--paper); transition: border-color .18s ease, box-shadow .18s ease; }
.feature-grid article:hover { border-color: var(--brand-tint-2); box-shadow: var(--shadow-1); }
.feature-grid article > span { font-family: var(--font-mono); font-size: 12px; letter-spacing: .1em; color: var(--gold); }
.feature-grid h3 { margin: 12px 0 8px; font-size: 17px; }
.feature-grid p { margin: 0; font-size: 14px; line-height: 1.75; color: var(--ink-2); }

/* 사양표 */
.spec-table { margin: 0; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.spec-table > div { display: grid; grid-template-columns: minmax(120px, 180px) minmax(0, 1fr); border-bottom: 1px solid var(--line); }
.spec-table > div:last-child { border-bottom: 0; }
.spec-table > div:hover { background: var(--bg); }
.spec-table dt, .spec-table dd { margin: 0; padding: 14px 18px; }
.spec-table dt { background: var(--bg); font-size: 13px; font-weight: 700; color: var(--ink-2); border-right: 1px solid var(--line); }
.spec-table dd { font-size: 14.5px; line-height: 1.7; }

/* 가격 패널 */
.price-panel {
  display: grid; grid-template-columns: 1fr 1fr; gap: 28px;
  padding: 28px 30px; border: 1px solid var(--brand-tint-2); border-radius: var(--r);
  background-color: var(--brand-tint); background-image: var(--rule-light);
}
.price-panel > div > span { display: block; font-size: 12px; color: var(--muted); }
.price-panel > div > strong { display: block; margin: 6px 0 10px; font-size: 36px; font-weight: 800; letter-spacing: -.045em; color: var(--brand); }
.discount-badge { display: inline-block; margin-right: 6px; padding: 5px 10px; border-radius: 999px; background: var(--gold-2); color: #2b1f08; font-size: 12px; font-weight: 700; }
.discount-badge.is-neutral { background: rgba(11, 83, 68, .12); color: var(--brand); }
.price-panel del { display: block; margin-top: 10px; font-size: 13px; color: var(--muted); }
.price-panel dl { margin: 0; }
.price-panel dl > div { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 11px 0; border-bottom: 1px solid rgba(11, 83, 68, .14); }
.price-panel dl > div:last-child { border-bottom: 0; }
.price-panel dt { flex: 0 0 auto; font-size: 13px; color: var(--muted); }
.price-panel dd { margin: 0; max-width: 62%; text-align: right; }
.term-main { display: block; font-size: 14px; font-weight: 700; line-height: 1.5; }
.term-note { display: block; margin-top: 4px; font-size: 11.5px; font-weight: 400; line-height: 1.6; color: var(--muted); }

.option-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.option-list li { padding: 9px 13px; border: 1px solid var(--line); border-radius: var(--r-xs); background: var(--paper); font-size: 13.5px; }

/* 선택 기준 · 확인할 점 · 체크리스트 */
.fit-guide-grid, .check-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fit-guide-grid > div { display: flex; gap: 12px; padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.fit-guide-grid span { flex: 0 0 26px; display: grid; place-items: center; height: 26px; border-radius: 50%; background: var(--brand-tint); color: var(--brand); font-size: 12px; font-weight: 700; }
.fit-guide-grid p, .check-grid p { margin: 0; font-size: 14px; line-height: 1.75; color: var(--ink-2); }
.check-grid > div { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.check-grid b { font-family: var(--font-mono); font-size: 12px; color: var(--gold); }

.limitations-list { display: grid; gap: 8px; margin: 0; padding: 20px 22px; list-style: none; border: 1px solid #e3d3ae; border-radius: var(--r); background: var(--gold-tint); }
.limitations-list li { position: relative; padding-left: 30px; font-size: 14px; line-height: 1.75; color: #5f4a1e; }
.limitations-list li::before {
  content: "!"; position: absolute; left: 0; top: 2px; display: grid; place-items: center;
  width: 20px; height: 20px; border-radius: 50%; background: #e0c98f; color: #5a4416; font-size: 12px; font-weight: 800;
}

/* 핵심 정리 — 어두운 블록 2 (대비 보장) */
.article-section.conclusion-box {
  position: relative; overflow: hidden; padding: 34px 36px; border: 0; border-radius: var(--r-lg);
  background-color: var(--brand-2);
  background-image: radial-gradient(80% 90% at 90% 6%, rgba(199, 154, 69, .18), transparent 56%), var(--rule-dark);
  color:var(--text-on-dark);
}
.article-section.conclusion-box .section-title > span { color: var(--gold-2); }
.article-section.conclusion-box .section-title > span::after { background: rgba(255, 255, 255, .2); }
.article-section.conclusion-box h2 { color: #fff; }
.article-section.conclusion-box > p, .article-section.conclusion-box p { max-width: 66ch; margin: 0; font-size: 16px; line-height: 1.95; color: var(--text-on-dark-muted); }

/* 출처 · 구매 링크 */
.source-section dl { margin: 0; border-top: 1px solid var(--line); }
.source-section dl > div { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.source-section dt { font-size: 13px; color: var(--muted); }
.source-section dd { margin: 0; font-size: 14px; }
.purchase-link-group { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 18px; }
.source-button {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 52px; padding: 12px 18px; border-radius: var(--r-sm);
  font-size: 14px; font-weight: 700; text-align: center;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.official-button { background: var(--paper); color: var(--brand); border: 1.5px solid var(--brand); }
.official-button:hover { background: var(--brand-tint); }
.product-button { background: var(--brand); color: #fff; border: 1.5px solid var(--brand); box-shadow: var(--shadow-1); }
.product-button:hover { background: var(--brand-2); }
.comparison-button { background: var(--paper); color: var(--brand); border: 1.5px solid var(--brand); }
.comparison-button:hover { background: var(--brand-tint); }
.source-button:hover { transform: translateY(-2px); }
.inline-button { display: inline-flex; min-height: 48px; background: var(--brand); color: #fff; }
.source-note { max-width: 70ch; margin-top: 12px !important; font-size: 12.5px !important; line-height: 1.7; color: var(--muted) !important; }

/* FAQ */
.faq-section details { margin-bottom: 8px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); overflow: hidden; }
.faq-section details[open] { border-color: var(--brand-tint-2); background: var(--bg); }
.faq-section summary { position: relative; padding: 17px 48px 17px 20px; font-size: 15px; font-weight: 700; line-height: 1.55; cursor: pointer; list-style: none; transition: color .16s ease; }
.faq-section summary::-webkit-details-marker { display: none; }
.faq-section summary:hover { color: var(--brand); }
.faq-section summary::after {
  content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%);
  display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%;
  background: var(--brand-tint); color: var(--brand); font-size: 16px; font-weight: 700;
}
.faq-section details[open] summary::after { content: "−"; }
.faq-section details p { margin: 0; padding: 0 20px 18px; font-size: 14.5px; line-height: 1.85; color: var(--ink-2); }

/* 관련 정보 */
.related-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.related-list a { display: grid; gap: 6px; padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); transition: border-color .18s ease, box-shadow .18s ease; }
.related-list a:hover { border-color: var(--brand-tint-2); box-shadow: var(--shadow-1); }
.related-list span { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; color: var(--gold); }
.related-list strong { font-size: 13.5px; font-weight: 700; line-height: 1.5; }
.related-list small { font-size: 12.5px; font-weight: 700; color: var(--brand); }

/* --------------------------------------------------------------------------
   7. 사이드 요약 · 모바일 구매 바 · 광고
   -------------------------------------------------------------------------- */
.article-aside { position: relative; min-width: 0; }
.sticky-card { position: sticky; top: calc(var(--header-h) + 18px); padding: 22px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); box-shadow: var(--shadow-1); }
.aside-product-image { aspect-ratio: 1 / 1; display: grid; place-items: center; margin-bottom: 16px; padding: 10px; border-radius: var(--r); background: var(--bg-2); overflow: hidden; }
.aside-product-image img { width: 100%; height: 100%; object-fit: contain; }
.aside-category { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; color: var(--gold); }
.sticky-card h2 { margin: 8px 0 16px; font-family: var(--font-sans); font-size: 18px; font-weight: 700; line-height: 1.5; letter-spacing: -.035em; }
.aside-price { padding: 14px 0; border-block: 1px solid var(--line); }
.aside-price small { display: block; font-size: 11.5px; color: var(--muted); }
.aside-price strong { display: block; margin: 4px 0; font-size: 26px; font-weight: 800; letter-spacing: -.04em; color: var(--brand); }
.aside-price del { font-size: 12.5px; color: var(--muted-2); }
.sticky-card dl { margin: 14px 0; }
.sticky-card dl > div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; }
.sticky-card dt { flex: 0 0 auto; font-size: 12.5px; color: var(--muted); margin: 0; }
.sticky-card dd { margin: 0; font-size: 12.5px; text-align: right; }
.sticky-card .term-main { font-size: 12.5px; }
.sticky-card .term-note { font-size: 11px; }
.aside-purchase-links { grid-template-columns: 1fr; margin-top: 12px; }
.copy-link { width: 100%; margin-top: 8px; padding: 11px; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--paper); font-size: 13px; font-weight: 700; cursor: pointer; transition: background .16s ease; }
.copy-link:hover { background: var(--bg); }
.editorial-card { margin-top: 12px; padding: 20px 22px; border: 1px solid var(--line); border-radius: var(--r); background: var(--bg); }
.editorial-card strong { font-size: 14px; }
.editorial-card p { margin: 6px 0 10px; font-size: 12.5px; line-height: 1.7; color: var(--muted); }
.editorial-card a { font-size: 12.5px; font-weight: 700; color: var(--brand); }

.mobile-source-bar { display: none; }

.ad-wrap { margin: 28px 0; }
.ad-label { display: block; margin-bottom: 6px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .16em; text-align: center; color: var(--muted-2); }
.ad-reserved { min-height: 112px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r); background: rgba(255, 255, 255, .6); contain: layout paint; }
.adsbygoogle { display: block; width: 100% !important; max-width: 100%; overflow: hidden !important; }

/* --------------------------------------------------------------------------
   8. 정책 · 안내 페이지
   -------------------------------------------------------------------------- */
.policy-page { min-height: 55vh; margin: 10px 0 60px; }
.policy-page h1 { font-size: clamp(28px, 3.6vw, 44px); }
.policy-page h2 { margin-top: 40px; font-size: 22px; }
.policy-page p { max-width: 68ch; color: var(--ink-2); }
.policy-page a { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }

/* --------------------------------------------------------------------------
   9. 반응형 — 1080 / 780 / 430
   -------------------------------------------------------------------------- */
@media (max-width: 1080px) {
  :root { --gutter: 24px; }
  .hero-inner { grid-template-columns: minmax(0, 1fr); gap: 40px; padding: 64px var(--gutter); }
  .hero-summary { max-width: 640px; }
  .trust-grid { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .product-layout { grid-template-columns: minmax(0, 1fr); }
  .article { max-width: 900px; margin-inline: auto; padding: 38px 36px 44px; }
  .article-aside { display: none; }
  .related-list { grid-template-columns: 1fr 1fr; }
  body.product-page { padding-bottom: 78px; }

  /* 모바일 구매 바 */
  .mobile-source-bar {
    position: fixed; left: 50%; bottom: max(12px, env(safe-area-inset-bottom)); z-index: 80;
    display: flex; align-items: center; justify-content: space-between; gap: 14px;
    width: min(620px, calc(100% - 28px)); padding: 10px 12px 10px 16px;
    border: 1px solid rgba(255, 255, 255, .16); border-radius: var(--r);
    background: rgba(8, 59, 49, .96); color: #fff; box-shadow: var(--shadow-dark);
    backdrop-filter: blur(10px);
    opacity: 0; visibility: hidden; pointer-events: none;
    transform: translate(-50%, 16px);
    transition: opacity .22s ease, transform .22s ease, visibility .22s;
  }
  .mobile-bar-visible .mobile-source-bar { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, 0); }
  .mobile-source-bar > div { display: grid; min-width: 0; }
  .mobile-source-bar small { font-size: 10.5px; color: var(--text-on-dark-muted); }
  .mobile-source-bar strong { max-width: 46vw; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mobile-purchase-links { display: flex; flex: 0 0 auto; gap: 6px; }
  .mobile-purchase-links a { display: inline-flex; align-items: center; justify-content: center; min-width: 62px; min-height: 42px; padding: 0 12px; border-radius: var(--r-xs); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
  .mobile-official { background: rgba(255, 255, 255, .92); color: var(--brand-2); }
  .mobile-comparison { background: var(--gold-2); color: #2b1f08; }
}

@media (max-width: 780px) {
  :root { --gutter: 16px; --header-h: 62px; }
  body { font-size: 15.5px; }

  .nav-toggle { display: grid; place-items: center; }
  .site-header nav {
    display: none; position: absolute; left: 12px; right: 12px; top: calc(var(--header-h) + 6px);
    flex-direction: column; align-items: stretch; gap: 2px; padding: 10px;
    border: 1px solid var(--line); border-radius: var(--r); background: var(--paper); box-shadow: var(--shadow-2);
  }
  .site-header nav.open { display: flex; }
  .site-header nav a { padding: 13px 14px; font-size: 15px; }
  .site-header nav a[aria-current="page"] { background: var(--brand-tint); }
  .site-header nav a[aria-current="page"]::after { display: none; }
  body.nav-open { overflow: hidden; }
  .brand small { display: none; }
  .brand img { width: 34px; height: 34px; }
  .brand strong { font-size: 18px; }

  .hero-inner { padding: 48px var(--gutter) 52px; }
  .hero h1 { font-size: clamp(30px, 8vw, 40px); margin: 14px 0 16px; }
  .hero-copy > p { font-size: 15.5px; margin-bottom: 22px; }
  .search-box { height: 56px; padding: 0 14px; }
  .hero-summary { padding: 20px; }
  .summary-primary strong { font-size: 42px; }
  .summary-grid div { padding: 14px 15px; }

  .category-overview, .listing-section { padding: 48px 0; }
  .section-heading, .listing-head { flex-direction: column; align-items: flex-start; gap: 14px; margin-bottom: 20px; }
  .product-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .category-cards { grid-template-columns: minmax(0, 1fr); }
  .card-visual { aspect-ratio: 16 / 10; }
  .trust-section { padding: 56px 0; }
  .trust-points { grid-template-columns: minmax(0, 1fr); }

  .category-hero-inner { grid-template-columns: 62px minmax(0, 1fr); gap: 16px; padding: 22px 0 32px; }
  .category-hero-symbol { width: 62px; height: 62px; border-radius: 17px; font-size: 27px; }
  .category-hero-inner > strong { display: none; }

  .product-layout { display: block; padding-bottom: 24px; }
  .article { padding: 26px 18px 32px; border-radius: var(--r); }
  .article-header { padding-bottom: 24px; }
  .article-header h1 { font-size: clamp(25px, 7.4vw, 33px); letter-spacing: -.04em; }
  .article-lead { font-size: 15.5px; line-height: 1.85; }
  .article-byline { gap: 6px; font-size: 11.5px; }
  .article-hero-facts { grid-template-columns: minmax(0, 1fr); }
  .product-main-image { margin: 22px 0 26px; }
  .direct-answer { padding: 22px 18px; }
  .direct-answer h2 { font-size: 21px; }
  .quick-facts { grid-template-columns: 1fr 1fr; }
  .table-of-contents { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 18px; }
  .table-of-contents ol { grid-template-columns: minmax(0, 1fr); }
  .article-section { padding: 34px 0; }
  .section-title h2 { font-size: 22px; }
  .article-section > p, .longform-sections p, .detail-blocks p { font-size: 15.5px; line-height: 1.88; }
  .longform-sections > section { padding: 20px 18px; }
  .detail-blocks > div { padding: 18px 18px; }
  .feature-grid, .fit-guide-grid, .check-grid, .related-list { grid-template-columns: minmax(0, 1fr); }
  .feature-grid article { padding: 18px; }
  .spec-table > div { grid-template-columns: minmax(0, 1fr); }
  .spec-table dt { padding: 12px 16px 4px; border-right: 0; background: transparent; color: var(--muted); }
  .spec-table dd { padding: 0 16px 14px; }
  .spec-table > div + div { border-top: 1px solid var(--line); }
  .price-panel { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 22px 18px; }
  .price-panel > div > strong { font-size: 30px; }
  .price-panel dl > div { display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 10px; }
  .price-panel dd { max-width: 100%; text-align: left; }
  .option-list { display: grid; grid-template-columns: minmax(0, 1fr); }
  .article-section.conclusion-box { padding: 26px 18px; }
  .article-section.conclusion-box > p, .article-section.conclusion-box p { font-size: 15.5px; }
  .source-section dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .purchase-link-group { grid-template-columns: 1fr 1fr; }
  .faq-section summary { padding: 15px 44px 15px 16px; font-size: 14.5px; }
  .faq-section details p { padding: 0 16px 16px; }

  .site-footer { margin-top: 56px; padding: 44px var(--gutter) 26px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 22px; padding: 26px 0; }
  .footer-bottom { flex-direction: column; gap: 8px; }
}

@media (max-width: 430px) {
  .article { padding: 22px 14px 28px; }
  .quick-facts { grid-template-columns: minmax(0, 1fr); }
  .purchase-link-group { grid-template-columns: minmax(0, 1fr); }
  .price-panel dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .footer-grid { grid-template-columns: minmax(0, 1fr); }
  .ad-reserved { min-height: 96px; }
  .mobile-source-bar { width: calc(100% - 16px); padding: 9px 10px 9px 13px; gap: 8px; }
  .mobile-source-bar strong { max-width: 38vw; font-size: 14px; }
  .mobile-purchase-links a { min-width: 54px; padding: 0 9px; font-size: 11.5px; }
  .compensation-disclosure { font-size: 12px; line-height: 1.5; }
}

/* --------------------------------------------------------------------------
   V8.5 mobile overflow hardening — 좁은 화면 가로 스크롤 차단
   -------------------------------------------------------------------------- */
main, .site-header, .site-footer, .article-shell, .content-shell, .hero-inner,
.product-layout, .article, .article-header, .article-section, .longform-sections,
.longform-sections > section, .direct-answer, .table-of-contents, .feature-grid,
.feature-grid > article, .spec-table, .price-panel, .fit-guide-grid, .check-grid,
.faq-section, .related-list, .source-section { min-width: 0; max-width: 100%; }

.article *, .policy-page *, .product-card *, .category-card * { min-width: 0; }
.article table, .policy-page table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; -webkit-overflow-scrolling: touch; }
.article pre, .article code { max-width: 100%; white-space: pre-wrap; overflow-wrap: anywhere; }
.article img, .article iframe, .article video, .ad-wrap ins { max-width: 100% !important; }
.spec-table dd, .price-panel dd, .source-section dd, .option-list li, .takeaway-list li, .limitations-list li { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }

/* --------------------------------------------------------------------------
   10. 접근성 · 인쇄 · 모션
   -------------------------------------------------------------------------- */
::selection { background: var(--brand-tint-2); color: var(--brand-3); }
:focus-visible { outline: 3px solid var(--gold-2); outline-offset: 3px; border-radius: 6px; }
.search-box:focus-within :focus-visible { outline: none; }

@supports (content-visibility: auto) {
  .product-card, .article-section { content-visibility: auto; contain-intrinsic-size: 1px 420px; }
}

@media (prefers-contrast: more) {
  :root { --line: #a9b3ab; --muted: #4c5a53; }
  .product-card > a, .category-card, .article, .quick-facts > div, .feature-grid article { border-width: 2px; }
}

@media print {
  .site-header, .site-footer, .ad-wrap, .reading-progress, .mobile-source-bar, .article-aside, .breadcrumb { display: none !important; }
  body { background: #fff; }
  .article { border: 0; box-shadow: none; padding: 0; }
  .product-layout { display: block; padding: 0; }
  .direct-answer, .article-section.conclusion-box { background: #fff !important; color: #000 !important; border: 1px solid #999 !important; }
  .direct-answer h2, .direct-answer p, .article-section.conclusion-box h2, .article-section.conclusion-box p, .takeaway-list li { color: #000 !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .product-card > a:hover, .source-button:hover, .category-card:hover { transform: none !important; }
}


/* V9.5.1 independent purchase and comparison links */
.mobile-purchase-links{display:flex;gap:7px;align-items:stretch}
.mobile-purchase-links a{display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.25}
.mobile-product{background:var(--brand);color:#fff}
.mobile-comparison{background:var(--paper);color:var(--brand);border:1px solid var(--brand)}
@media(max-width:520px){.mobile-purchase-links a{font-size:11px;padding:9px 10px}}


/* V9.5.7 홈 제품 더 보기 */
.load-more-wrap {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: 28px;
}
.load-more-wrap[hidden] { display: none !important; }
.load-more-panel {
  width: min(100%, 480px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 18px 18px 16px;
  border: 1px solid rgba(11, 102, 85, .14);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(8, 59, 49, .06);
  text-align: center;
}
.load-more-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  min-height: 50px;
  padding: 12px 24px;
  border: 1px solid #b7d4cc;
  border-radius: 999px;
  background: var(--brand);
  color: #fff;
  font: inherit;
  font-weight: 800;
  letter-spacing: -.01em;
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(11, 102, 85, .16);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.load-more-button:hover {
  transform: translateY(-1px);
  background: #095548;
  box-shadow: 0 12px 24px rgba(11, 102, 85, .2);
}
.load-more-button:focus-visible { outline: 3px solid rgba(11, 102, 85, .2); outline-offset: 3px; }
.load-more-status { margin: 0; font-size: 13px; line-height: 1.45; color: var(--muted); }
@media (max-width: 700px) {
  .load-more-wrap { margin-top: 22px; }
  .load-more-panel { width: 100%; padding: 16px 14px; }
  .load-more-button { width: 100%; min-width: 0; }
}


/* V9.6.0 performance + ad-free article index */
.product-card,.related-list>a,.article-section{content-visibility:auto;contain-intrinsic-size:1px 420px}
.card-visual img{will-change:auto}
.article-index-page{padding-bottom:92px;background:#f5f7f5}
.article-index-main{min-height:70vh}
.article-index-hero{padding:74px 0 34px;background:linear-gradient(145deg,#072f28,#0b5a4c);color:#fff}
.article-index-hero .content-shell{position:relative}
.article-index-hero .eyebrow{color:#c6ded5}
.article-index-hero h1{margin:8px 0 10px;font-family:var(--font-serif);font-size:clamp(34px,5vw,62px);letter-spacing:-.05em}
.article-index-hero p{max-width:720px;margin:0;color:#d6e5df;line-height:1.75}
.article-index-summary{display:flex;align-items:baseline;gap:8px;margin-top:24px}
.article-index-summary strong{font-size:30px}
.article-index-summary span{font-weight:800}
.article-index-summary small{margin-left:8px;color:#b9d0c8}
.article-index-section{padding-top:34px;padding-bottom:48px}
.article-index-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:14px}
.article-index-head h2{margin:4px 0 0;font-size:26px;letter-spacing:-.04em}
.article-index-head>strong{color:var(--brand);font-size:15px}
.article-index-list{display:grid;margin:0;padding:0;list-style:none;border:1px solid var(--line);border-radius:18px;background:#fff;overflow:hidden;box-shadow:0 12px 34px rgba(8,59,49,.06)}
.article-index-row{content-visibility:auto;contain-intrinsic-size:1px 68px;border-top:1px solid #e8eeeb}
.article-index-row:first-child{border-top:0}
.article-index-row[hidden]{display:none!important}
.article-index-row>a{display:grid;grid-template-columns:58px minmax(0,1fr) 94px 24px;gap:14px;align-items:center;min-height:68px;padding:11px 18px;color:inherit;text-decoration:none;transition:background .15s ease}
.article-index-row>a:hover{background:#f5faf7}
.article-index-number{font-family:var(--font-mono);font-size:11px;color:#8a9a93}
.article-index-copy{display:grid;gap:4px;min-width:0}
.article-index-copy strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;letter-spacing:-.02em}
.article-index-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:11px}
.article-index-row time{font-family:var(--font-mono);font-size:10px;color:#7c8d85;text-align:right}
.article-index-row>a>b{color:var(--brand);font-size:17px;text-align:right}
.article-index-empty{margin-top:16px}
.article-search-dock{position:fixed;z-index:80;left:0;right:0;bottom:0;padding:max(10px,env(safe-area-inset-bottom)) 16px max(10px,env(safe-area-inset-bottom));background:rgba(245,247,245,.94);border-top:1px solid rgba(11,102,85,.14);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.article-search-inner{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:10px;width:min(920px,100%);min-height:54px;margin:0 auto;padding:0 10px 0 16px;border:1px solid #b9ccc4;border-radius:16px;background:#fff;box-shadow:0 10px 26px rgba(8,59,49,.12)}
.article-search-inner svg{width:20px;height:20px;fill:none;stroke:#47655b;stroke-width:1.8}
.article-search-inner input{width:100%;height:52px;border:0;outline:0;background:transparent;font:inherit;font-size:14px}
.article-search-inner button{min-width:54px;height:36px;padding:0 10px;border:0;border-radius:10px;background:#edf5f1;color:#0b6655;font:inherit;font-size:11px;font-weight:850;cursor:pointer}
.article-search-inner button[hidden]{display:none}
@media(max-width:700px){
  .article-index-page{padding-bottom:88px}
  .article-index-hero{padding:54px 0 28px}
  .article-index-section{padding-top:24px}
  .article-index-row>a{grid-template-columns:38px minmax(0,1fr) 20px;gap:9px;min-height:64px;padding:10px 12px}
  .article-index-row time{display:none}
  .article-index-copy strong{font-size:13px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .article-index-copy small{font-size:10px}
  .article-search-dock{padding-left:10px;padding-right:10px}
}

/* V9.6.4 purchase/subscription intent separation */
.commerce-variant{margin:18px 0 28px;padding:16px 18px;border:1px solid var(--line);border-radius:18px;background:#f8faf9;display:flex;align-items:center;justify-content:space-between;gap:18px}
.commerce-variant>div{display:grid;gap:5px;min-width:0}.commerce-variant span{font-size:11px;font-weight:900;letter-spacing:.08em;color:var(--accent);text-transform:uppercase}.commerce-variant strong{font-size:14px;line-height:1.65;color:var(--text);font-weight:700}
.commerce-variant>a{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;padding:10px 13px;border-radius:12px;border:1px solid rgba(11,102,85,.2);background:#fff;color:var(--accent-dark);font-size:12px;font-weight:900;text-decoration:none}.commerce-variant>a:hover{background:#eef6f2}.commerce-variant>a b{font-size:14px}
@media (max-width:760px){.commerce-variant{align-items:stretch;flex-direction:column}.commerce-variant>a{justify-content:center;width:100%}}

/* ==========================================================================
   V9.7.2 Soft Rose Atelier — 여성 친화형 프리미엄 3D UI
   로즈베이지 · 크림화이트 · 소프트토프 · 샴페인, 딥 로즈는 포인트만 사용
   ========================================================================== */
:root{
  --paper:#fffdfc;
  --bg:#faf6f5;
  --bg-2:#f3eceb;
  --ink:#2f2729;
  --ink-2:#554a4d;
  --muted:#817478;
  --muted-2:#a29397;
  --brand:#a95364;
  --brand-2:#7d3e4b;
  --brand-3:#3d2c31;
  --brand-tint:#f8ecef;
  --brand-tint-2:#ecd3d9;
  --gold:#9a765e;
  --gold-2:#c5a07f;
  --gold-tint:#fbf5ef;
  --line:#eadfe1;
  --line-2:#d8c8cc;
  --danger:#984657;
  --text-on-dark:#fffaf9;
  --text-on-dark-muted:#eadde0;
  --r-xs:10px;
  --r-sm:14px;
  --r:18px;
  --r-lg:24px;
  --shadow-1:0 1px 0 rgba(255,255,255,.96) inset,0 4px 8px rgba(81,55,62,.045),0 18px 34px -22px rgba(93,59,68,.28);
  --shadow-2:0 1px 0 rgba(255,255,255,1) inset,0 8px 18px rgba(81,55,62,.055),0 32px 58px -28px rgba(93,59,68,.34);
  --shadow-dark:0 28px 58px -24px rgba(65,41,48,.38);
  --rule-dark:repeating-linear-gradient(180deg,rgba(255,255,255,.045) 0 1px,transparent 1px 34px);
  --rule-light:repeating-linear-gradient(180deg,rgba(125,62,75,.027) 0 1px,transparent 1px 34px)
}
body{
  background:
    radial-gradient(circle at 8% 1%,rgba(222,188,196,.22),transparent 27%),
    radial-gradient(circle at 94% 12%,rgba(223,205,188,.16),transparent 24%),
    linear-gradient(180deg,#fffdfc 0%,#faf6f5 48%,#f6f0ef 100%);
}
.site-header{
  background:rgba(255,253,252,.91)!important;
  border-color:rgba(125,62,75,.09)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.94) inset,0 10px 28px rgba(83,58,64,.055)!important;
  backdrop-filter:blur(22px) saturate(1.16);
}
.brand img,.footer-brand img{box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 9px 18px rgba(94,58,68,.13)}
.brand strong{color:#68404a}
.site-header nav a:hover{background:#f7eef0;color:#884654}
.site-header nav a[aria-current="page"]{color:#884654}
.site-header nav a[aria-current="page"]::after{background:linear-gradient(90deg,#bd7280,#d3b18f)}
.reading-progress{background:linear-gradient(90deg,#a95364,#d4b293)}

/* 홈 히어로: 넓은 빨강 면적을 없애고 밝은 로즈베이지 입체 패널로 전환 */
.hero,.detail-hero,.category-hero,.article-index-hero{
  background:
    radial-gradient(circle at 82% 8%,rgba(255,255,255,.95),transparent 26%),
    radial-gradient(circle at 11% 94%,rgba(220,185,193,.23),transparent 36%),
    linear-gradient(145deg,#fffdfc 0%,#f7edef 52%,#efe4e5 100%)!important;
  color:var(--ink)!important;
  border-bottom:1px solid rgba(125,62,75,.09);
  box-shadow:inset 0 1px 0 rgba(255,255,255,1),0 26px 60px -42px rgba(82,51,60,.32)!important;
}
.hero h1,.category-hero h1,.article-index-hero h1{color:#392d31!important;text-shadow:0 1px 0 rgba(255,255,255,.9)}
.hero-copy>p,.category-hero p,.article-index-hero p{color:#675a5e!important}
.hero .eyebrow,.article-index-hero .eyebrow{color:#9d5665!important}
.hero-trust span{
  border-color:rgba(125,62,75,.13);
  background:rgba(255,255,255,.58);
  color:#735e64;
  box-shadow:0 1px 0 rgba(255,255,255,.92) inset,0 8px 18px -14px rgba(80,50,58,.22);
}
.search-box{
  border-color:rgba(125,62,75,.10);
  background:rgba(255,255,255,.92);
  box-shadow:0 1px 0 rgba(255,255,255,1) inset,0 18px 38px -22px rgba(93,59,68,.28);
}
.search-box:focus-within{border-color:#c8949f;box-shadow:0 1px 0 #fff inset,0 18px 38px -22px rgba(93,59,68,.28),0 0 0 4px rgba(169,83,100,.08)}

.hero-summary,.summary-primary{
  border-color:rgba(125,62,75,.10)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(250,241,243,.9))!important;
  box-shadow:0 1px 0 #fff inset,0 22px 44px -26px rgba(91,57,66,.3)!important;
}
.summary-primary{padding:18px 20px;border-radius:17px!important}
.summary-primary small,.summary-primary span{color:#806d72!important}
.summary-primary strong{color:#824656!important}
.summary-grid{background:rgba(125,62,75,.08)}
.summary-grid div{background:rgba(255,253,252,.92)!important}
.summary-grid b{color:#4b363c!important}.summary-grid small{color:#8e7d81!important}

/* 카드와 목록 — 부드러운 3D 레이어 */
.product-card>a,.category-card,.article-index-list,.load-more-panel,
.article,.sticky-card,.editorial-card,.commerce-variant{
  border-color:rgba(125,62,75,.10)!important;
  background:linear-gradient(145deg,#fff 0%,#fffdfc 56%,#faf2f3 100%)!important;
  box-shadow:0 1px 0 rgba(255,255,255,1) inset,0 5px 12px rgba(75,51,57,.045),0 24px 46px -30px rgba(93,59,68,.32)!important;
}
.product-card>a:hover,.category-card:hover,.related-list a:hover,.feature-grid article:hover{
  transform:translateY(-5px) perspective(1000px) rotateX(.35deg)!important;
  border-color:rgba(169,83,100,.24)!important;
  box-shadow:0 1px 0 #fff inset,0 8px 18px rgba(75,51,57,.055),0 32px 58px -27px rgba(93,59,68,.38)!important;
}
.card-visual,.aside-product-image,.product-image-frame{
  background:
    radial-gradient(circle at 76% 12%,rgba(255,255,255,.82),transparent 26%),
    linear-gradient(145deg,#f8f3f1,#efe6e5)!important;
  border-color:#eadfe1!important;
}
.card-visual.has-product-image img{filter:drop-shadow(0 16px 18px rgba(75,52,58,.13))}
.category-symbol,.category-hero-symbol{
  background:linear-gradient(145deg,#fff,#f4e8eb)!important;
  color:#9b5160!important;
  border:1px solid rgba(125,62,75,.08);
  box-shadow:0 1px 0 #fff inset,0 12px 24px -17px rgba(94,58,68,.30)!important;
}

/* 본문 안의 모든 주요 정보박스에 동일한 3D 언어 적용 */
.article-hero-facts>div,.quick-facts>div,.table-of-contents,.longform-sections>section,
.detail-blocks>div,.notice-box,.feature-grid article,.spec-table,.price-panel,
.limitations-list,.faq-section details,.related-list a,.source-card,.detail-card,
.article-card,.check-grid>*,.fit-guide-grid>*{
  border-color:rgba(125,62,75,.105)!important;
  background:linear-gradient(145deg,#fff 0%,#fffdfc 58%,#faf3f3 100%)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.98) inset,0 4px 9px rgba(77,52,59,.035),0 18px 36px -27px rgba(94,58,68,.30)!important;
}
.article-hero-facts>div,.quick-facts>div{position:relative;overflow:hidden}
.article-hero-facts>div::after,.quick-facts>div::after{
  content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.98),transparent)
}
.article-hero-facts>div::before{background:linear-gradient(180deg,#b66776,#d4b08f)!important}
.longform-sections>section,.feature-grid article,.faq-section details,.related-list a{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.longform-sections>section:hover,.faq-section details:hover{transform:translateY(-2px);box-shadow:0 1px 0 #fff inset,0 22px 38px -28px rgba(94,58,68,.34)!important}
.detail-blocks>div{border-left:3px solid #b46b79!important;border-radius:0 16px 16px 0!important}
.notice-box,.limitations-list{background:linear-gradient(145deg,#fffaf5,#fbf2ea)!important;border-color:#ead8c9!important}
.notice-box strong,.limitations-list li{color:#715e52!important}
.limitations-list li::before{background:#ead9c7!important;color:#7c6452!important}

/* 표 — PC에서 폭을 온전히 사용하고 셀도 입체적으로 */
.article table,.policy-page table{
  width:100%!important;
  max-width:100%;
  border:1px solid var(--line)!important;
  border-radius:16px;
  background:#fffdfc;
  box-shadow:0 1px 0 #fff inset,0 16px 30px -26px rgba(93,59,68,.27);
}
.article table th,.policy-page table th{background:#f6edef!important;color:#674b53!important}
.article table td,.policy-page table td{background:rgba(255,253,252,.94)}
.spec-table{overflow:hidden!important}
.spec-table>div{border-color:#eee3e5!important}
.spec-table>div:hover{background:#fbf6f6!important}
.spec-table dt{background:#f8f1f2!important;border-color:#eadde0!important;color:#64545a!important}

/* 어두운 강조영역도 강한 레드 대신 딥 플럼 */
.direct-answer,.trust-section,.site-footer{
  background:
    radial-gradient(circle at 85% 0%,rgba(196,145,155,.13),transparent 30%),
    linear-gradient(145deg,#49343a,#392a2e 62%,#302429)!important;
  color:#fffaf9!important;
}
.direct-answer{border:1px solid rgba(255,255,255,.08)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 24px 46px -29px rgba(48,34,39,.5)!important}
.direct-answer h2,.trust-grid h2{color:#fffaf9!important}
.direct-answer>p,.trust-grid>div>p,.trust-points p{color:#e6dadd!important}
.trust-points article{
  border-color:rgba(255,255,255,.10)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.045))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 18px 34px -26px rgba(0,0,0,.34)!important;
}
.trust-points strong{color:#fffaf9!important}.trust-points b{color:#d9b9a0!important}

/* CTA — 포인트 레드/로즈는 화면 면적을 작게 사용 */
.primary-button,.cta-primary,.product-button,.inline-button,.load-more-button{
  background:linear-gradient(180deg,#b76575 0%,#9c4e5d 54%,#843d4b 100%)!important;
  border-color:#7b3946!important;
  color:#fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32),inset 0 -2px 0 rgba(69,32,40,.15),0 12px 22px rgba(110,59,70,.16)!important;
}
.primary-button:hover,.cta-primary:hover,.product-button:hover,.inline-button:hover,.load-more-button:hover{
  background:linear-gradient(180deg,#bf7080,#9b4e5d 58%,#773642)!important;
  transform:translateY(-2px)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 16px 28px rgba(110,59,70,.20)!important;
}
.official-button,.comparison-button{
  background:linear-gradient(180deg,#fff,#fbf4f5)!important;
  color:#8c4856!important;
  border-color:#d8b7be!important;
  box-shadow:inset 0 1px 0 #fff,0 8px 16px -13px rgba(93,59,68,.30);
}
.official-button:hover,.comparison-button:hover{background:#f7ecef!important}
.filter-row button.active,.chip.active{
  background:linear-gradient(180deg,#ad5a69,#914653)!important;
  color:#fff!important;border-color:#87414f!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30),0 8px 16px rgba(107,59,69,.13)!important;
}
.eyebrow,.price strong,.product-card .price,.detail-price strong,.aside-price strong{color:#98505f!important}
.discount-badge{background:#d8b798!important;color:#503b2f!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}
.status-badge,.article-byline a{background:#f7e9ec!important;color:#925060!important;border-color:#e8cfd5!important}
.faq-section summary::after{background:#f4e5e8!important;color:#955162!important;box-shadow:inset 0 1px 0 #fff}

/* 하단 고정 바도 진한 빨강 대신 고급 플럼 */
.mobile-source-bar{background:rgba(62,44,50,.96)!important;border-color:rgba(255,255,255,.12)!important;box-shadow:0 18px 42px rgba(55,38,44,.26)!important}
.mobile-official{color:#76404c!important}.mobile-comparison{background:#d0ad8d!important;color:#45352b!important}

/* 글 목록 검색 */
.article-index-hero .article-index-summary strong{color:#7f4653}
.article-index-hero .article-index-summary span{color:#66555a}.article-index-hero .article-index-summary small{color:#927e83}
.article-search-dock{background:rgba(250,246,245,.93)!important;border-color:rgba(125,62,75,.10)!important}
.article-search-inner{border-color:#ddcdd0!important;box-shadow:0 12px 28px rgba(83,58,64,.09)!important}
.article-search-inner button{background:#f5e9ec!important;color:#8d4958!important}
.article-index-row>a:hover{background:#fbf5f6!important}

@media(max-width:780px){
  .product-card>a:hover,.category-card:hover,.related-list a:hover,.feature-grid article:hover,.longform-sections>section:hover,.faq-section details:hover{transform:none!important}
  .hero,.detail-hero,.category-hero,.article-index-hero{box-shadow:none!important}
}

/* V9.7.3 LG comparison guide */
.comparison-hero{padding:34px 0 52px;background:linear-gradient(180deg,#fbf4f5 0%,#fff 100%);border-bottom:1px solid var(--line)}
.comparison-hero h1{max-width:980px;margin:14px 0 12px;font-size:clamp(30px,4vw,52px);line-height:1.16;letter-spacing:-.035em;color:#392d31}
.comparison-hero p{max-width:850px;margin:0;color:var(--ink-2);font-size:15px;line-height:1.8}
.comparison-code-pair{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:24px}.comparison-code-pair strong{padding:11px 16px;border:1px solid var(--line);border-radius:999px;background:#fff;font-family:var(--font-mono);font-size:14px}.comparison-code-pair span{font-size:11px;font-weight:900;letter-spacing:.12em;color:var(--brand)}
.comparison-article{max-width:1020px;padding-top:42px;padding-bottom:64px}.comparison-article>section{margin:0 0 48px}.comparison-article h2{margin:0 0 18px;font-size:clamp(23px,2.7vw,34px);letter-spacing:-.025em}.comparison-article h3{margin:0 0 8px;font-size:18px}.comparison-article p,.comparison-article li{font-size:15px;line-height:1.85;color:var(--ink-2)}
.answer-first{padding:26px 28px;border:1px solid #e4cbd0;border-radius:24px;background:linear-gradient(145deg,#fff 0%,#fbf1f3 100%);box-shadow:var(--shadow-1)}.answer-first p{margin:10px 0 0;font-size:16px;color:#4a3b40}
.comparison-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow-1)}.comparison-table{width:100%;border-collapse:collapse;min-width:680px}.comparison-table th,.comparison-table td{padding:15px 16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;font-size:14px;line-height:1.6}.comparison-table thead th{background:#f8eff1;color:#573941;font-weight:800}.comparison-table tbody th{width:24%;background:#fcf9f9;color:#5e5054}.comparison-table tr:last-child th,.comparison-table tr:last-child td{border-bottom:0}
.difference-grid,.choice-grid,.price-compare-grid,.source-products,.related-guide-list,.series-model-grid,.guide-list-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.difference-grid article,.choice-grid article,.price-compare-grid article{padding:20px;border:1px solid var(--line);border-radius:18px;background:#fff}.difference-grid article>span,.choice-grid article>span{display:inline-block;margin-bottom:10px;font-family:var(--font-mono);font-size:11px;font-weight:800;color:var(--brand)}.difference-grid p{margin:0}.choice-grid ul{margin:12px 0 18px;padding-left:20px}.choice-grid a{display:inline-flex;font-weight:800;color:var(--brand)}.price-compare-grid small{display:block;margin-bottom:8px;color:var(--muted);font-family:var(--font-mono)}.price-compare-grid strong{display:block;font-size:25px;color:#54343d}.price-compare-grid p{margin:6px 0 0;font-size:13px}.comparison-note{margin-top:12px!important;padding:12px 14px;border-left:3px solid var(--brand-tint-2);background:#fcf8f9;font-size:13px!important}
.source-products a,.related-guide-list a,.series-model-grid a{display:flex;flex-direction:column;gap:5px;padding:17px 18px;border:1px solid var(--line);border-radius:16px;background:#fff;transition:.18s ease}.source-products a:hover,.related-guide-list a:hover,.series-model-grid a:hover{transform:translateY(-2px);border-color:var(--brand-tint-2);box-shadow:var(--shadow-1)}.source-products strong,.series-model-grid strong{font-family:var(--font-mono);color:var(--brand)}.source-products span,.series-model-grid span,.related-guide-list span{font-size:13px;color:var(--muted)}.series-model-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.series-model-grid small{margin-top:4px;font-weight:700;color:#4f3e43}
.comparison-index-section{padding:52px 0 72px}.comparison-index-section>.category-cards{margin-bottom:28px}.guide-list-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.guide-card{display:flex;min-height:210px;flex-direction:column;padding:20px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 8px 24px rgba(83,58,64,.04);transition:.18s ease}.guide-card:hover{transform:translateY(-2px);border-color:var(--brand-tint-2);box-shadow:var(--shadow-1)}.guide-card>span{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--brand)}.guide-card>strong{margin:10px 0 8px;font-size:17px;line-height:1.55;color:#413337}.guide-card>p{margin:0 0 16px;font-size:13px;line-height:1.7;color:var(--muted)}.guide-card>b{margin-top:auto;font-size:13px;color:var(--brand)}
@media(max-width:860px){.guide-list-grid,.series-model-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.comparison-hero{padding:24px 0 38px}.comparison-article{padding-top:30px}.answer-first{padding:20px}.difference-grid,.choice-grid,.price-compare-grid,.source-products,.related-guide-list,.series-model-grid,.guide-list-grid{grid-template-columns:minmax(0,1fr)}.comparison-table th,.comparison-table td{padding:12px 13px}.guide-card{min-height:0}}


/* V9.7.4 comparison affiliate CTA */
.comparison-disclosures{padding-top:18px}
.comparison-disclosures .compensation-disclosure+.compensation-disclosure{margin-top:8px}
.comparison-cta-section{padding:24px;border:1px solid var(--line);border-radius:20px;background:#fff}
.comparison-purchase-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}
.comparison-purchase-links .source-button{width:100%;min-height:50px;text-align:center;justify-content:center}
.comparison-mobile-source-bar>div{min-width:0}
.comparison-mobile-links a{max-width:150px;overflow:hidden;text-overflow:ellipsis}
@media(max-width:700px){
  .comparison-disclosures{padding-top:12px}
  .comparison-purchase-links{grid-template-columns:minmax(0,1fr)}
  .comparison-mobile-source-bar{gap:8px}
  .comparison-mobile-source-bar>div{display:none}
  .comparison-mobile-source-bar .comparison-mobile-links{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .comparison-mobile-source-bar .comparison-mobile-links a{max-width:none;width:100%;min-width:0}
}

/* V9.7.5 professional LG comparison guide */
.comparison-article{width:min(1080px,calc(100% - 40px));max-width:1080px;margin:0 auto}
.comparison-cover{margin:0 0 46px;padding:26px;border:1px solid rgba(125,62,75,.12);border-radius:28px;background:linear-gradient(145deg,#fff 0%,#fbf4f5 100%);box-shadow:0 24px 54px -38px rgba(75,48,56,.34)}
.comparison-cover-grid{display:grid;grid-template-columns:minmax(0,1fr) 58px minmax(0,1fr);align-items:center;gap:18px}
.comparison-product-visual{min-width:0;text-align:center}.comparison-image-frame{display:grid;place-items:center;aspect-ratio:1/1;padding:22px;border:1px solid #eadfe1;border-radius:22px;background:radial-gradient(circle at 50% 22%,#fff 0%,#faf5f4 62%,#f0e7e6 100%);overflow:hidden}.comparison-image-frame img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 20px rgba(73,50,56,.14))}.comparison-image-placeholder{display:grid;place-items:center;aspect-ratio:1/1;border-radius:22px;background:#f3ecec;color:#9b6c76;font-weight:900;font-size:40px}.comparison-product-visual>strong{display:block;margin-top:15px;font-family:var(--font-mono);font-size:15px;color:#7f4653}.comparison-product-visual>span{display:block;margin-top:5px;color:var(--muted);font-size:13px;line-height:1.5}.comparison-vs{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#8e4c59;color:#fff;font-size:12px;font-weight:900;letter-spacing:.08em;box-shadow:0 10px 22px rgba(104,59,69,.2)}.comparison-cover figcaption{margin-top:16px;text-align:center;color:var(--muted);font-size:11px}
.section-kicker{margin-bottom:8px;color:#9a5362;font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.section-intro{margin:-5px 0 20px!important;max-width:860px;color:var(--muted)!important}
.price-gap-summary{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;margin-top:18px;padding:14px 16px;border-radius:14px;background:#fff;border:1px solid #ead9dd}.price-gap-summary strong{color:#824958;font-size:12px}.price-gap-summary span{color:#514247;font-size:13px;line-height:1.65}
.common-spec-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}.common-spec-grid article{padding:16px;border:1px solid var(--line);border-radius:16px;background:#fff}.common-spec-grid span{display:block;margin-bottom:7px;color:var(--muted);font-size:11px}.common-spec-grid strong{font-size:14px;color:#44363a;line-height:1.55}
.difference-analysis{display:grid;gap:11px}.difference-analysis article{display:grid;grid-template-columns:38px minmax(0,1fr);gap:14px;padding:18px 20px;border:1px solid var(--line);border-radius:18px;background:#fff}.difference-analysis article>span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#f7e9ec;color:#955162;font-family:var(--font-mono);font-size:10px;font-weight:900}.difference-analysis h3{margin:1px 0 7px}.difference-analysis p{margin:0!important;color:#615358!important}.comparison-empty-note{padding:20px;border:1px solid var(--line);border-radius:18px;background:#fff}.comparison-empty-note strong{display:block;margin-bottom:6px}.comparison-empty-note p{margin:0!important}
.model-analysis-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.model-analysis-card{display:flex;flex-direction:column;min-width:0;padding:22px;border:1px solid var(--line);border-radius:20px;background:#fff}.model-analysis-head span{font-family:var(--font-mono);font-size:11px;font-weight:900;color:#955162}.model-analysis-head h3{margin:7px 0 14px;font-size:19px;line-height:1.45}.model-highlight-list{margin:0 0 18px;padding-left:19px}.model-highlight-list li{margin:7px 0;font-size:13.5px;line-height:1.7}.model-fit-box{margin-top:auto;padding:16px;border-radius:15px;background:#faf5f6}.model-fit-box>strong{display:block;margin-bottom:8px;font-size:12px;color:#7b4753}.model-fit-box ul{margin:0;padding-left:18px}.model-fit-box li{margin:5px 0;font-size:12.5px;line-height:1.65}.text-link{display:inline-flex;margin-top:16px;font-size:13px;font-weight:850;color:#8e4c59}
.decision-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.decision-steps article{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff}.decision-steps b{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#8e4c59;color:#fff}.decision-steps h3{margin:2px 0 7px;font-size:15px}.decision-steps p{margin:0!important;font-size:13px!important;line-height:1.7!important}
.comparison-cta-section h2{margin-bottom:4px}.comparison-purchase-links{margin-top:14px}
@media (min-width:1081px){.comparison-article{padding-left:34px;padding-right:34px}.comparison-table th,.comparison-table td{padding:17px 18px}.comparison-hero .content-shell{max-width:1080px}.comparison-cover{padding:30px}.comparison-image-frame{padding:28px}}
@media (min-width:701px) and (max-width:1080px){.comparison-article{width:min(100% - 32px,960px);padding-top:34px}.comparison-cover{padding:20px}.comparison-cover-grid{grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr);gap:12px}.comparison-vs{width:44px;height:44px}.common-spec-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.decision-steps{grid-template-columns:1fr}.comparison-table{min-width:640px}}
@media (max-width:700px){.comparison-article{width:calc(100% - 24px);padding-top:22px;padding-bottom:92px}.comparison-article>section{margin-bottom:36px}.comparison-article h2{font-size:24px;line-height:1.35}.comparison-cover{margin-bottom:30px;padding:13px;border-radius:20px}.comparison-cover-grid{grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr);gap:7px}.comparison-image-frame{padding:8px;border-radius:14px}.comparison-vs{width:30px;height:30px;font-size:8px}.comparison-product-visual>strong{margin-top:9px;font-size:10.5px;overflow-wrap:anywhere}.comparison-product-visual>span{display:none}.comparison-cover figcaption{font-size:9px}.answer-first{padding:18px}.price-gap-summary{grid-template-columns:1fr;gap:5px}.common-spec-grid,.model-analysis-grid{grid-template-columns:1fr}.difference-analysis article{grid-template-columns:30px minmax(0,1fr);gap:10px;padding:15px 14px}.difference-analysis article>span{width:28px;height:28px;border-radius:8px}.model-analysis-card{padding:18px}.decision-steps{grid-template-columns:1fr}.comparison-table-wrap{margin-left:-2px;margin-right:-2px;border-radius:14px}.comparison-table{min-width:610px}.comparison-table th,.comparison-table td{font-size:12px;line-height:1.5}.comparison-purchase-links{grid-template-columns:1fr}.comparison-cta-section{padding:18px}.comparison-cta-section .source-button{min-height:48px;font-size:13px}.comparison-mobile-links a{font-size:11px;padding-left:7px;padding-right:7px}.mobile-source-bar>div{display:none!important}.mobile-source-bar .comparison-mobile-links{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.mobile-source-bar .comparison-mobile-links a{width:100%;min-width:0;max-width:none}}


/* V9.7.6 comparison table + all-device sticky CTA */
/* 비교표는 generic .article table{display:block} 영향을 받지 않고 실제 table layout을 유지합니다. */
.comparison-table-wrap{
  width:100%;
  max-width:100%;
  overflow:hidden;
}
.article .comparison-table{
  display:table !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  table-layout:fixed;
  border-collapse:collapse;
  overflow:visible;
}
.comparison-table thead,.comparison-table tbody{width:100%}
.comparison-table th,.comparison-table td{
  min-width:0 !important;
  max-width:none !important;
  white-space:normal;
  word-break:keep-all;
  overflow-wrap:anywhere;
  hyphens:auto;
}
.comparison-table thead th:first-child,.comparison-table tbody th{width:20% !important}
.comparison-table thead th:nth-child(2),.comparison-table thead th:nth-child(3),
.comparison-table tbody td:nth-child(2),.comparison-table tbody td:nth-child(3){width:40%}

/* 제품글/비교글 모두 PC·태블릿·모바일 하단 CTA 고정 */
body.product-page,body.comparison-guide-page{padding-bottom:96px}
.mobile-source-bar{
  position:fixed;
  left:50%;
  bottom:max(14px,env(safe-area-inset-bottom));
  z-index:120;
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  width:min(900px,calc(100% - 32px));
  padding:11px 12px 11px 16px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:16px;
  background:rgba(62,44,50,.96)!important;
  color:#fff;
  box-shadow:0 18px 42px rgba(55,38,44,.26)!important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,16px);
  transition:opacity .22s ease,transform .22s ease,visibility .22s;
}
.mobile-bar-visible .mobile-source-bar{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.mobile-source-bar>div{display:grid;min-width:0}
.mobile-source-bar strong{max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mobile-purchase-links{display:flex;flex:0 0 auto;gap:8px}
.mobile-purchase-links a{min-height:44px;padding:0 15px;border-radius:10px}
.comparison-mobile-source-bar,.comparison-guide-page .mobile-source-bar{width:min(980px,calc(100% - 32px))}
.comparison-guide-page .mobile-source-bar .comparison-mobile-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:min(520px,58vw)}
.comparison-guide-page .mobile-source-bar .comparison-mobile-links a{width:100%;max-width:none;min-width:0}

/* 전문 비교 정보 밀도 */
.comparison-deep-dive{display:grid;gap:14px}
.comparison-deep-dive article{padding:20px 22px;border:1px solid var(--line);border-radius:18px;background:#fff}
.comparison-deep-dive h3{margin:0 0 10px;font-size:17px;line-height:1.45;color:#44363a}
.comparison-deep-dive p{margin:0!important}
.comparison-deep-dive .deep-label{display:inline-block;margin-bottom:8px;color:#955162;font-size:10px;font-weight:900;letter-spacing:.1em}
.comparison-judgement{margin-top:12px;padding:13px 14px;border-radius:13px;background:#faf5f6;color:#5f4d52;font-size:13px;line-height:1.7}

@media (min-width:1081px){
  .comparison-table th,.comparison-table td{font-size:14px;line-height:1.65;padding:17px 18px}
  .mobile-source-bar{width:min(960px,calc(100% - 48px))}
}
@media (min-width:701px) and (max-width:1080px){
  body.product-page,body.comparison-guide-page{padding-bottom:94px}
  .comparison-table thead th:first-child,.comparison-table tbody th{width:22% !important}
  .comparison-table thead th:nth-child(2),.comparison-table thead th:nth-child(3),.comparison-table tbody td:nth-child(2),.comparison-table tbody td:nth-child(3){width:39%}
  .mobile-source-bar{width:calc(100% - 28px)}
  .comparison-guide-page .mobile-source-bar .comparison-mobile-links{min-width:min(470px,62vw)}
}
@media (max-width:700px){
  body.product-page,body.comparison-guide-page{padding-bottom:104px}
  .comparison-table-wrap{overflow:hidden;border-radius:14px}
  .article .comparison-table{min-width:0 !important;table-layout:fixed}
  .comparison-table thead th:first-child,.comparison-table tbody th{width:25% !important}
  .comparison-table thead th:nth-child(2),.comparison-table thead th:nth-child(3),.comparison-table tbody td:nth-child(2),.comparison-table tbody td:nth-child(3){width:37.5%}
  .comparison-table th,.comparison-table td{padding:10px 8px!important;font-size:11px!important;line-height:1.5!important;letter-spacing:-.02em}
  .comparison-table thead th{font-size:10.5px!important}
  .mobile-source-bar{width:calc(100% - 16px);padding:9px 10px;gap:8px}
  .mobile-source-bar>div{display:none!important}
  .mobile-source-bar .mobile-purchase-links{width:100%;display:grid;grid-template-columns:minmax(0,1fr);gap:7px}
  .product-page .mobile-source-bar .mobile-purchase-links:has(a+a){grid-template-columns:repeat(2,minmax(0,1fr))}
  .comparison-guide-page .mobile-source-bar .comparison-mobile-links{width:100%;min-width:0;grid-template-columns:repeat(2,minmax(0,1fr))}
  .mobile-purchase-links a{width:100%;min-width:0;padding:0 8px;font-size:11px;white-space:normal;text-align:center;line-height:1.25}
  .comparison-deep-dive article{padding:16px}
}


/* V9.8.0 CTA 리디자인 — 가로형 정렬, 적정 크기, 높은 가독성 */
.mobile-source-bar .cta-benefit{
  --cta-top:#ee7f9f;
  --cta-mid:#d75c7e;
  --cta-bottom:#bb3f61;
  --cta-shadow:#7f2940;
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:4px;
  min-height:58px;
  min-width:280px;
  padding:10px 52px 10px 16px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:16px;
  background:linear-gradient(180deg,var(--cta-top) 0%, var(--cta-mid) 55%, var(--cta-bottom) 100%);
  color:#fff;
  text-decoration:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 8px 18px rgba(76,17,35,.20), 0 3px 0 var(--cta-shadow);
  overflow:hidden;
  transform:translateY(0);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease, border-color .18s ease;
}
.mobile-source-bar .cta-benefit::before{
  content:"";
  position:absolute;
  left:1px;
  right:1px;
  top:1px;
  height:44%;
  border-radius:15px 15px 11px 11px;
  background:linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,0));
  pointer-events:none;
}
.mobile-source-bar .cta-benefit::after{
  content:"›";
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  z-index:1;
  width:26px;
  height:26px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
  font-size:17px;
  line-height:1;
  font-weight:900;
}
.mobile-source-bar .cta-benefit:hover{
  transform:translateY(-2px);
  filter:brightness(1.03);
  border-color:rgba(255,255,255,.40);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34), 0 12px 22px rgba(76,17,35,.24), 0 5px 0 var(--cta-shadow);
}
.mobile-source-bar .cta-benefit:active{
  transform:translateY(1px);
  box-shadow:inset 0 2px 6px rgba(91,22,43,.18), 0 5px 10px rgba(76,17,35,.16), 0 1px 0 var(--cta-shadow);
}
.mobile-source-bar .cta-benefit:focus-visible{outline:3px solid rgba(255,229,235,.95);outline-offset:3px}
.mobile-source-bar .cta-benefit .cta-model,
.mobile-source-bar .cta-benefit .cta-copy{
  position:relative;
  z-index:1;
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.mobile-source-bar .cta-benefit .cta-model{
  font-size:11px;
  line-height:1.1;
  font-weight:900;
  letter-spacing:.04em;
  opacity:.96;
}
.mobile-source-bar .cta-benefit .cta-copy{
  font-size:14px;
  line-height:1.15;
  font-weight:900;
  letter-spacing:-.03em;
}
.product-page .mobile-source-bar .mobile-purchase-links .cta-benefit{
  width:clamp(260px,34vw,360px);
}
.comparison-guide-page .mobile-source-bar .comparison-mobile-links{min-width:min(560px,64vw)}
.comparison-guide-page .mobile-source-bar .comparison-mobile-links .cta-benefit{
  min-width:0;
  width:100%;
  min-height:58px;
  padding-right:40px;
}
.comparison-guide-page .mobile-source-bar .comparison-mobile-links .cta-benefit .cta-model{font-size:10px}
.comparison-guide-page .mobile-source-bar .comparison-mobile-links .cta-benefit .cta-copy{font-size:11.2px}
@media (hover:none){
  .mobile-source-bar .cta-benefit:hover{transform:none;filter:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 8px 18px rgba(76,17,35,.20), 0 3px 0 var(--cta-shadow)}
}
@media (max-width:1080px){
  .product-page .mobile-source-bar .mobile-purchase-links .cta-benefit{width:clamp(240px,40vw,320px)}
  .comparison-guide-page .mobile-source-bar .comparison-mobile-links{min-width:min(500px,68vw)}
}
@media (max-width:700px){
  .mobile-source-bar{width:calc(100% - 8px);padding:8px 8px 8px;gap:6px;border-radius:14px}
  .mobile-source-bar .cta-benefit{
    min-width:0;
    min-height:54px;
    padding:8px 38px 8px 12px;
    border-radius:14px;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 6px 12px rgba(76,17,35,.18),0 2px 0 var(--cta-shadow);
  }
  .product-page .mobile-source-bar .mobile-purchase-links{width:100%;display:grid;grid-template-columns:minmax(0,1fr);justify-items:stretch}
  .product-page .mobile-source-bar .mobile-purchase-links .cta-benefit{justify-self:stretch;width:100%;max-width:none}
  .mobile-source-bar .cta-benefit::after{right:10px;width:22px;height:22px;font-size:15px}
  .mobile-source-bar .cta-benefit .cta-model{font-size:9.5px}
  .mobile-source-bar .cta-benefit .cta-copy{font-size:10.8px}
  .comparison-guide-page .mobile-source-bar .comparison-mobile-links .cta-benefit{padding-right:30px}
  .comparison-guide-page .mobile-source-bar .comparison-mobile-links .cta-model{font-size:8.8px}
  .comparison-guide-page .mobile-source-bar .comparison-mobile-links .cta-copy{font-size:9.7px}
}