@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@400;600&display=swap");
/* ============================================================
   FINEART 브랜드 CSS v2 — 단일 진실: ../../../FINEART-OS.md §6.2
   미술관 톤(절제·정확·존중) × Nordic 구조(여백·유동 타이포·미니멀 그리드)
   무드: 화이트 갤러리 + 다크 섹션(히어로·권위 밴드·푸터)  [2026-06-10 사장님 확정]
   ⚠️ 12단 컴포넌트(A~I) 클래스는 라이브 detailContent가 참조 — 이름 변경 금지.
   ============================================================ */

/* ---------- 1. 토큰 ---------- */
:root{
  --ink:#1C1A17;        /* 정본 V1 — 웜 블랙 (규약 Ver 2.0) */
  --ink-2:#2A2723;
  --paper:#FBFBFA;      /* 종이의 흰색 */
  --paper-warm:#FBFBFA; /* 미색 폐기(2026-06-10 사장님) — 화이트톤 단일 */
  --line:#E4E1DB;
  --line-soft:#EFEDE9;
  --text:#3A352D;       /* 본문 — 잉크보다 한 톤 연하게 */
  --text-mute:#6F665A;  /* Stone — 가독성 다크닝 #8A8174→#6F665A (대비 3.71→5.45:1) */
  --accent:#B5654A;     /* 유일 강조색: 테라코타 — 책임·서명의 자리에만 */
  --accent-soft:#bfdbfe;

  --font-sans:"Pretendard",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Segoe UI",Roboto,sans-serif;
  --font-serif:"Noto Serif KR",Georgia,serif;

  /* v2 — Nordic 구조 레이어 (여백·타이포 체계) */
  --page-w:1280px;
  --page-pad:clamp(20px, 4vw, 64px);
  --section-gap:clamp(56px, 9vw, 128px);
  --radius:12px;
  --radius-sm:8px;

  --fs-hero:clamp(44px, 7vw, 96px);      /* 히어로 시그니처 */
  --fs-h1:clamp(28px, 4vw, 48px);
  --fs-h2:clamp(22px, 3vw, 32px);
  --fs-eyebrow:12.5px;
  --fs-body:16px;
}

/* ---------- 2. 전역 베이스 ---------- */
body{
  color:var(--text);
  font-family:var(--font-sans);
  background:var(--paper);
  line-height:1.7;
  font-size:var(--fs-body);
}
a{ color:var(--accent); text-decoration:none; }
a:hover{ color:var(--ink); }
h1,h2,h3,h4{ font-family:var(--font-sans); color:var(--ink); font-weight:600; letter-spacing:-0.01em; }

/* 컨테이너 폭 — Storefront .col-full 확장 */
.col-full{ max-width:var(--page-w); padding-left:var(--page-pad); padding-right:var(--page-pad); }

/* 호객색 무력화: 인라인 핑크/빨강 → 브랜드 잉크 */
[style*="#ff008c"],[style*="#FF008C"],
[style*="#ba0000"],[style*="#BA0000"]{
  color:var(--ink) !important;
}

/* ---------- 3. 헤더 — 미니멀 화이트 ---------- */
.site-header{
  background:var(--paper);
  border-bottom:1px solid var(--line-soft);
  padding-top:0;
}
.site-header .col-full{ padding-top:14px; padding-bottom:8px; }
.site-branding .custom-logo{ max-height:34px; width:auto; }
.site-branding h1{ margin-bottom:0; }
.site-title a, .site-header .site-title a{
  color:var(--ink); font-weight:600; letter-spacing:0.22em; text-transform:uppercase;
  font-size:20px;
}
.site-description{ display:none; }

/* 내비 — 넓은 간격, 소문자 절제 */
.main-navigation ul li a{
  color:var(--text); font-weight:500; font-size:14px; letter-spacing:0.04em;
  padding:0 clamp(10px, 1.4vw, 20px);
}
.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a{ color:var(--accent); }
.storefront-primary-navigation{ background:var(--paper); }
.secondary-navigation{ display:none; }

/* 헤더 장바구니·검색 절제 */
.site-header-cart .cart-contents{ color:var(--text); }
.site-header-cart .cart-contents .amount{ color:var(--text-mute); font-size:13px; }
.storefront-handheld-footer-bar{ border-top:1px solid var(--line-soft); }

/* 빵부스러기·샵 헤더 정리 (홈=Shop) */
.woocommerce-breadcrumb{ display:none; }
.woocommerce-products-header{ display:none; }

/* ---------- 3b. FINEART 히어로 (다크, 홈 전용) ---------- */
.fineart-hero{
  background:linear-gradient(160deg, var(--ink) 0%, var(--ink-2) 100%);
  color:#fff;
  /* 풀블리드 — 컨테이너 밖 화면 전체 폭 */
  margin:0 calc(50% - 50vw) clamp(40px, 6vw, 88px);
  padding:clamp(72px, 12vw, 160px) max(var(--page-pad), calc(50vw - var(--page-w)/2)) clamp(64px, 10vw, 140px);
  text-align:center;
}
.fineart-hero__mark{
  font-size:var(--fs-eyebrow); letter-spacing:0.5em; color:#94a3b8;
  text-transform:uppercase; margin-bottom:clamp(20px, 3vw, 36px);
}
.fineart-hero__title{
  font-family:var(--font-serif); font-weight:300;
  font-size:var(--fs-hero); line-height:1.08; letter-spacing:-0.02em;
  color:#fff; margin:0 0 clamp(14px, 2vw, 24px);
}
.fineart-hero__sub{
  font-size:clamp(15px, 1.6vw, 19px); color:var(--line);
  font-weight:300; letter-spacing:0.02em; margin-bottom:clamp(28px, 4vw, 48px);
}
.fineart-hero__badge{
  display:inline-block; font-size:var(--fs-eyebrow); color:var(--accent-soft);
  padding:7px 18px; border:1px solid #475569; border-radius:99px; letter-spacing:0.14em;
}

/* ---------- 3c. 권위 밴드 (다크, 홈 하단) ---------- */
.fineart-band{
  background:linear-gradient(160deg, var(--ink-2) 0%, var(--ink) 100%);
  color:#fff;
  margin:var(--section-gap) calc(50% - 50vw) 0;
  padding:clamp(56px, 8vw, 104px) max(var(--page-pad), calc(50vw - var(--page-w)/2));
  text-align:center;
}
.fineart-band__eyebrow{
  font-size:var(--fs-eyebrow); letter-spacing:0.4em; color:#94a3b8;
  text-transform:uppercase; margin-bottom:20px;
}
.fineart-band__lead{
  font-size:clamp(19px, 2.4vw, 28px); font-weight:300; line-height:1.55;
  max-width:680px; margin:0 auto 18px; color:#f1f5f9;
}
.fineart-band__meta{ font-size:13px; color:#94a3b8; letter-spacing:0.06em; }

/* ---------- 4. 슬로건 블록 (컴포넌트 A — 상세, 라이브 참조 유지) ---------- */
.fineart-slogan{
  margin:24px 0; padding:clamp(40px,6vw,64px) 28px; border:1px solid var(--line); border-radius:var(--radius);
  background:linear-gradient(135deg,var(--ink) 0%,var(--ink-2) 100%);
  color:#fff; text-align:center;
}
.fineart-slogan__mark{ font-size:13px; letter-spacing:0.4em; color:#94a3b8; text-transform:uppercase; margin-bottom:18px; }
.fineart-slogan__title{ font-family:var(--font-serif); font-size:clamp(32px, 5vw, 48px); font-weight:300; letter-spacing:-0.02em; color:#fff; margin-bottom:8px; }
.fineart-slogan__promise{ font-size:17px; color:var(--line); margin-bottom:24px; }
.fineart-slogan__badge{ display:inline-block; font-size:12px; color:var(--accent-soft); padding:5px 14px; border:1px solid #475569; border-radius:99px; letter-spacing:0.1em; }

/* ---------- 5. 권위 블록 (컴포넌트 B) ---------- */
.fineart-authority{ margin:48px 0; padding:32px 24px; background:var(--paper); border:1px solid var(--line-soft); border-radius:var(--radius); text-align:center; }
.fineart-authority .eyebrow{ font-size:11px; letter-spacing:0.3em; color:var(--accent); margin-bottom:14px; }
.fineart-authority .lead{ font-size:18px; color:var(--text); line-height:1.7; }
.fineart-authority .meta{ font-size:13px; color:var(--text-mute); margin-top:14px; }

/* ---------- 6. 규격표 (컴포넌트 C) ---------- */
.fineart-spec{ width:100%; border-collapse:collapse; margin:32px 0; font-size:14px; color:var(--text); }
.fineart-spec td{ padding:12px 8px; border-bottom:1px solid var(--line); }
.fineart-spec td.k{ color:var(--text-mute); width:30%; }

/* ---------- 7. 제작 공정 스텝 (컴포넌트 D) ---------- */
.fineart-process{ margin:48px 0; }
.fineart-process .eyebrow{ font-size:11px; letter-spacing:0.3em; color:var(--accent); text-align:center; margin-bottom:24px; }
.fineart-process .steps{ display:flex; justify-content:space-between; gap:12px; text-align:center; flex-wrap:wrap; }
.fineart-process .steps .step{ flex:1; min-width:60px; }
.fineart-process .steps .n{ font-family:var(--font-serif); font-size:28px; color:var(--ink); }
.fineart-process .steps .l{ font-size:13px; color:var(--text); margin-top:6px; }
@media (max-width:480px){
  .fineart-process .steps{ gap:8px; }
  .fineart-process .steps .n{ font-size:22px; }
}

/* ---------- 8. 주문 안내 블록 (컴포넌트 E) ---------- */
.fineart-order{ margin:48px 0 24px; padding:24px; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper); }
.fineart-order .eyebrow{ font-size:11px; letter-spacing:0.3em; color:var(--text-mute); margin-bottom:16px; }
.fineart-order .steps{ font-size:14px; color:var(--text); line-height:1.9; }
.fineart-order .note{ font-size:13px; color:var(--text-mute); margin-top:16px; }

/* ---------- 9. WooCommerce 버튼·가격 ---------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce #respond input#submit,
.woocommerce .single_add_to_cart_button,
.woocommerce input.button{
  background:var(--ink) !important; color:#fff !important;
  border-radius:var(--radius-sm) !important; font-weight:600; letter-spacing:0.02em;
  border:1px solid var(--ink) !important; box-shadow:none !important;
  transition:background 0.15s;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce input.button:hover{ background:var(--ink-2) !important; border-color:var(--ink-2) !important; }

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt{
  background:var(--accent) !important; border-color:var(--accent) !important;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover{ background:#5a3400 !important; border-color:#5a3400 !important; }

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price{
  color:var(--text) !important; font-weight:500;
}
.woocommerce div.product p.price del,
.woocommerce div.product span.price del{ color:var(--text-mute) !important; }

.woocommerce span.onsale{ background:var(--accent) !important; color:#fff !important; border-radius:99px; }
.woocommerce .quantity .qty{ border:1px solid var(--line); border-radius:6px; color:var(--text); }

/* ---------- 10. 상품 그리드 — 갤러리 스타일 (v2 개편) ---------- */
/* 미술관 벽: 그림자·보더 없음, 이미지가 주인공, 넉넉한 간격 */
.woocommerce ul.products{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:clamp(28px, 4vw, 56px) clamp(20px, 3vw, 40px);
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  width:auto !important; margin:0 !important; float:none !important;
  text-align:left;
}
.woocommerce ul.products li.product img{
  border-radius:var(--radius);
  aspect-ratio:1/1; object-fit:cover; width:100%;
  margin-bottom:14px !important;
  transition:opacity 0.2s;
}
.woocommerce ul.products li.product a:hover img{ opacity:0.92; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:15px; color:var(--ink); font-weight:500; line-height:1.5;
  padding:0; margin-bottom:4px;
}
.woocommerce ul.products li.product .price{ font-size:14px; }
.woocommerce ul.products li.product .price .amount{ color:var(--text); }
/* 갤러리 무드: 루프 내 장바구니 버튼 비표시(상세에서 구매) */
.woocommerce ul.products li.product .button{ display:none; }
.woocommerce ul.products li.product .star-rating{ display:none; }

/* 정렬·카운트 바 절제 */
.woocommerce-result-count{ color:var(--text-mute); font-size:13px; }
.woocommerce-ordering select{
  border:1px solid var(--line); border-radius:var(--radius-sm); color:var(--text);
  padding:6px 10px; font-size:13px; background:var(--paper);
}

/* 사이드바 제거 — 풀폭 갤러리 */
body.woocommerce #secondary,
body.woocommerce-page #secondary{ display:none; }
body.woocommerce #primary,
body.woocommerce-page #primary{ width:100% !important; float:none !important; }

@media (max-width:840px){
  .woocommerce ul.products{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:480px){
  .woocommerce ul.products{ grid-template-columns:repeat(2, 1fr); gap:24px 14px; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title{ font-size:13.5px; }
}

/* ---------- 11. 푸터 — 다크 ---------- */
.site-footer{
  background:linear-gradient(160deg, var(--ink) 0%, var(--ink-2) 100%);
  color:#94a3b8;
  margin-top:var(--section-gap);
}
.site-footer a{ color:#cbd5e1; }
.site-footer a:hover{ color:#fff; }
.site-footer h1,.site-footer h2,.site-footer h3,.site-footer h4{ color:#f1f5f9; }
.site-info{ color:#94a3b8; font-size:12px; } /* 다크 푸터 대비 3.65→6.77 */
.fineart-footer-sign{
  text-align:center; font-size:11px; letter-spacing:0.25em; color:#94a3b8;
  text-transform:uppercase; padding:28px 0 8px;
}

/* ---------- 12. 다크 배경 로고: fineart-logo-white.png 사용 ---------- */

/* ---------- 13. ④ 작품·공정 본문 ---------- */
.fineart-body-section{
  margin:48px 0; padding:32px 24px; background:var(--paper); border:1px solid var(--line-soft); border-radius:var(--radius);
}
.fineart-body-section .eyebrow{
  font-size:11px; letter-spacing:0.3em; color:var(--accent);
  text-transform:uppercase; margin-bottom:16px;
}
.fineart-body-section .section-title{
  font-size:24px; font-weight:600; color:var(--ink); margin:0 0 20px; line-height:1.3;
}
.fineart-body-section p{
  font-size:15px; color:var(--text); line-height:1.7; margin:0 0 16px;
}
.fineart-body-section p.note-mute{
  font-size:13px; color:var(--text-mute); margin-top:0;
}

/* ---------- 14. ⑤ 규격표 섹션 ---------- */
.fineart-spec-section{ margin:32px 0; }
.fineart-spec-section .eyebrow{
  font-size:11px; letter-spacing:0.3em; color:var(--accent);
  text-transform:uppercase; margin-bottom:12px;
}

/* ---------- 15. 아코디언 공통 ---------- */
.fineart-accordion{
  border:1px solid var(--line); border-radius:var(--radius);
  margin:32px 0; padding:0; overflow:hidden;
}
.fineart-accordion__summary{
  display:flex; justify-content:space-between; align-items:center;
  padding:16px 20px; cursor:pointer; list-style:none;
  background:var(--paper);
}
.fineart-accordion__summary::-webkit-details-marker{ display:none; }
.fineart-accordion__summary .eyebrow{
  font-size:11px; letter-spacing:0.3em; color:var(--accent);
  text-transform:uppercase; margin:0;
}
.fineart-accordion__arrow{ width:16px; height:16px; position:relative; flex-shrink:0; }
.fineart-accordion__arrow::before,
.fineart-accordion__arrow::after{
  content:""; position:absolute; background:var(--text-mute); border-radius:2px;
  transition:transform 0.2s;
}
.fineart-accordion__arrow::before{ width:10px; height:2px; top:7px; left:3px; }
.fineart-accordion__arrow::after{ width:2px; height:10px; top:3px; left:7px; }
details[open] .fineart-accordion__arrow::after{ transform:scaleY(0); }
.fineart-accordion .fineart-spec{ margin:0; }
.fineart-accordion table,
.fineart-accordion .fineart-faq__item:first-of-type{ border-top:1px solid var(--line); }

/* ---------- 16. F — 핵심 요약바 ---------- */
.fineart-hook{
  margin:40px 0; padding:28px 24px;
  background:var(--paper); border:1px solid var(--line-soft); border-radius:var(--radius);
}
.fineart-hook__line{
  font-size:17px; color:var(--text); font-weight:500;
  line-height:1.5; margin-bottom:20px;
}
.fineart-hook__points{
  list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px;
}
.fineart-hook__points li{
  font-size:14px; color:var(--text); padding-left:16px; position:relative; line-height:1.6;
}
.fineart-hook__points li::before{
  content:"–"; position:absolute; left:0; color:var(--accent);
}
@media(max-width:600px){
  .fineart-hook__line{ font-size:16px; }
}

/* ---------- 17. G — 차별화 비교 ---------- */
.fineart-compare{
  margin:48px 0; padding:32px 24px;
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
}
.fineart-compare .eyebrow{
  font-size:11px; letter-spacing:0.3em; color:var(--accent);
  text-transform:uppercase; margin-bottom:14px;
}
.fineart-compare__title{
  font-size:20px; color:var(--ink); margin:0 0 20px; font-weight:600; line-height:1.3;
}
.fineart-compare__wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.fineart-compare__table{
  width:100%; border-collapse:collapse; font-size:13px; min-width:420px;
}
.fineart-compare__table th{
  padding:10px 12px; background:var(--paper); color:var(--text-mute);
  font-weight:600; font-size:12px; text-align:left; border-bottom:2px solid var(--line);
}
.fineart-compare__table th.our{ background:var(--ink); color:#fff; }
.fineart-compare__table td{
  padding:10px 12px; border-bottom:1px solid var(--line); color:var(--text);
  vertical-align:top;
}
.fineart-compare__table td.our{ color:var(--ink); font-weight:500; }
.fineart-compare__note{
  font-size:12px; color:var(--text-mute); margin-top:14px; line-height:1.5;
}
@media(max-width:600px){
  .fineart-compare{ padding:20px 16px; }
  .fineart-compare__title{ font-size:18px; }
}

/* ---------- 18. H — 소셜프루프 ---------- */
.fineart-proof{
  margin:48px 0; padding:32px 24px;
  background:var(--paper); border:1px solid var(--line-soft); border-radius:var(--radius);
}
.fineart-proof .eyebrow{
  font-size:11px; letter-spacing:0.3em; color:var(--accent);
  text-transform:uppercase; margin-bottom:20px;
}
.fineart-proof__grid{
  display:flex; gap:24px; flex-wrap:wrap; justify-content:center; margin-bottom:24px;
}
.fineart-proof__item{ flex:1; min-width:120px; text-align:center; }
.fineart-proof__num{
  font-family:var(--font-serif); font-size:32px; font-weight:300;
  color:var(--ink); line-height:1.2;
}
.fineart-proof__label{
  font-size:12px; color:var(--text-mute); margin-top:6px; line-height:1.4;
}
.fineart-proof__cases{
  border-top:1px solid var(--line); padding-top:20px; display:flex; flex-direction:column; gap:12px;
}
.fineart-proof__case{
  font-size:13px; color:var(--text); line-height:1.7;
  padding-left:12px; border-left:2px solid var(--line);
}
.fineart-proof__note{
  font-size:11px; color:var(--text-mute); margin-top:16px; line-height:1.5;
}
@media(max-width:480px){
  .fineart-proof__num{ font-size:26px; }
  .fineart-proof__grid{ gap:16px; }
}

/* ---------- 19. I — FAQ 아코디언 ---------- */
.fineart-faq{ margin:48px 0; }
.fineart-faq .eyebrow{
  font-size:11px; letter-spacing:0.3em; color:var(--accent);
  text-transform:uppercase; margin-bottom:14px;
}
.fineart-faq__title{
  font-size:22px; color:var(--ink); margin:0 0 20px; font-weight:600;
}
.fineart-faq__item{
  border:1px solid var(--line); border-radius:10px; margin-bottom:8px; overflow:hidden;
}
.fineart-faq__q{
  display:flex; justify-content:space-between; align-items:flex-start;
  padding:16px 20px; cursor:pointer; list-style:none;
  font-size:15px; font-weight:500; color:var(--text); line-height:1.5;
  background:var(--paper);
}
.fineart-faq__q::-webkit-details-marker{ display:none; }
.fineart-faq__q::after{
  content:"+"; flex-shrink:0; margin-left:12px; font-size:18px;
  color:var(--accent); font-weight:300; line-height:1; transition:transform 0.2s;
}
details[open] .fineart-faq__q::after{ content:"–"; }
.fineart-faq__a{
  padding:0 20px 16px; font-size:14px; color:var(--text); line-height:1.75;
  background:var(--paper);
}
@media(max-width:600px){
  .fineart-faq__q{ font-size:14px; padding:14px 16px; }
  .fineart-faq__a{ padding:0 16px 14px; }
}

/* ---------- 20. Sticky CTA — 모바일 하단 고정 ---------- */
.fineart-sticky-cta{
  display:none;
  position:fixed; bottom:0; left:0; right:0; z-index:999;
  background:var(--paper); border-top:1px solid var(--line);
  padding:12px 16px; gap:12px;
}
@media(max-width:600px){
  .fineart-sticky-cta{ display:flex; align-items:center; }
}
.fineart-sticky-cta__btn{
  flex:1; display:block; text-align:center; text-decoration:none;
  background:var(--ink); color:#fff;
  padding:14px 0; border-radius:var(--radius-sm); font-size:15px; font-weight:600;
  letter-spacing:0.02em; border:none; cursor:pointer;
  transition:background 0.15s;
}
.fineart-sticky-cta__btn:hover{ background:var(--ink-2); color:#fff; }
.fineart-sticky-cta__note{
  font-size:11px; color:var(--text-mute); text-align:center; margin-top:4px; width:100%;
}
@media(max-width:600px){
  body.woocommerce-page .entry-summary{ padding-bottom:80px; }
}


/* ---------- 21. 모바일 정비 (2026-06-10) ---------- */
/* 본문 콘텐츠 이미지 절대 넘침 방지 */
.woocommerce div.product .woocommerce-Tabs-panel img,
.woocommerce div.product .entry-content img,
.fineart-imgseq img{ max-width:100% !important; height:auto !important; }
/* Storefront 핸드헬드 바 ↔ sticky CTA 충돌: 상품 상세에선 핸드헬드 바 숨김 */
@media(max-width:768px){
  .single-product .storefront-handheld-footer-bar{ display:none; }
  .single-product .site-footer{ padding-bottom:84px; } /* sticky CTA 높이 보정 */
  .fineart-hero{ padding-top:56px; padding-bottom:48px; }
  .fineart-hero__title{ font-size:clamp(36px, 11vw, 56px); }
  .fineart-compare__wrap::after{ content:"← 옆으로 밀어 보세요"; display:block; font-size:11px; color:var(--text-mute); padding:6px 2px; }
  .fineart-body-section{ padding:24px 16px; }
  .fineart-proof{ padding:24px 16px; }
}

/* 홈 갤러리: 정렬·카운트 바 제거 (훅 제거가 Storefront 래퍼에 안 먹는 케이스 대비) */
.post-type-archive-product .woocommerce-result-count,
.post-type-archive-product .woocommerce-ordering,
.page-template-template-homepage .woocommerce-result-count,
.woocommerce.archive .storefront-sorting{ display:none !important; }

/* ============================================================
   22. 에디토리얼 레이어 — "전시" 콘셉트 (2026-06-10 와우 리디자인)
   상세페이지 = 전시 도록. 기존 12단 클래스 보존, 추가만.
   ============================================================ */

/* 모션 — JS(fineart.js) 연동, reduced-motion 존중 */
.reveal{ opacity:0; transform:translateY(14px); }
.reveal.in{ opacity:1; transform:none; transition:opacity .7s ease, transform .7s ease; }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; }
}

/* 시네마틱 오프닝 — 상품 이미지 배경 + 세리프 선언 */
.fineart-cinema{
  position:relative; overflow:hidden;
  margin:0 calc(50% - 50vw) clamp(32px, 5vw, 64px);
  min-height:clamp(420px, 72vh, 760px);
  background-image:var(--cinema-bg); background-size:cover; background-position:center;
  display:flex; align-items:flex-end; justify-content:center;
  text-align:center; color:#fff;
}
.fineart-cinema::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(15,23,42,.18) 0%, rgba(15,23,42,.28) 55%, rgba(15,23,42,.78) 100%);
}
.fineart-cinema__inner{ position:relative; padding:0 var(--page-pad) clamp(40px, 7vw, 88px); max-width:880px; }
.fineart-cinema__mark{
  font-size:var(--fs-eyebrow); letter-spacing:0.5em; color:#cbd5e1;
  text-transform:uppercase; margin-bottom:18px;
}
.fineart-cinema__statement{
  font-family:var(--font-serif); font-weight:300;
  font-size:clamp(26px, 4.6vw, 52px); line-height:1.25; letter-spacing:-0.01em;
  color:#fff; margin:0 0 18px; text-shadow:0 1px 24px rgba(15,23,42,.35);
}
.fineart-cinema__badge{
  display:inline-block; font-size:var(--fs-eyebrow); color:#e2e8f0;
  padding:7px 18px; border:1px solid rgba(255,255,255,.35); border-radius:99px; letter-spacing:0.14em;
}

/* 도록 챕터 — 텍스트·이미지 교차 */
.fineart-chapter{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px, 5vw, 72px);
  align-items:center; margin:clamp(56px, 9vw, 120px) 0;
}
.fineart-chapter--rev .fineart-chapter__text{ order:2; }
.fineart-chapter--rev .fineart-chapter__media{ order:1; }
.fineart-chapter__num{
  font-family:var(--font-serif); font-size:clamp(40px, 5vw, 64px); font-weight:300;
  color:var(--line); line-height:1; margin-bottom:14px;
}
.fineart-chapter__title{
  font-size:clamp(20px, 2.4vw, 28px); font-weight:600; color:var(--ink);
  letter-spacing:-0.01em; margin:0 0 16px; line-height:1.35;
}
.fineart-chapter__body{
  font-size:16px; color:var(--text); line-height:1.85; max-width:38ch; margin:0;
}
.fineart-chapter__media img{ width:100%; border-radius:var(--radius); display:block; }
.fineart-chapter__caption{
  font-size:11px; letter-spacing:0.08em; color:var(--text-mute); padding:10px 2px 0;
}
.fineart-chapter--solo{ grid-template-columns:1fr; }
.fineart-chapter--solo .fineart-chapter__body{ max-width:56ch; }
@media (max-width:760px){
  .fineart-chapter{ grid-template-columns:1fr; gap:20px; margin:48px 0; }
  .fineart-chapter--rev .fineart-chapter__text{ order:1; }
  .fineart-chapter--rev .fineart-chapter__media{ order:2; }
}

/* 풀블리드 작품 컷 + 미술관 라벨 캡션 */
.fineart-bleed{
  margin:clamp(48px, 8vw, 104px) calc(50% - 50vw);
}
.fineart-bleed img{
  width:100%; max-height:82vh; object-fit:cover; display:block; border-radius:0;
}
.fineart-bleed figcaption{
  max-width:var(--page-w); margin:0 auto;
  padding:12px var(--page-pad) 0;
  font-size:11px; letter-spacing:0.12em; color:var(--text-mute); text-transform:none;
}

/* 도록 인용 — 실제 리뷰를 비평문처럼 */
.fineart-pullquote{
  max-width:720px; margin:clamp(56px, 9vw, 110px) auto; padding:0 var(--page-pad);
  text-align:center;
}
.fineart-pullquote__mark{
  font-family:var(--font-serif); font-size:64px; line-height:.6; color:var(--accent);
  display:block; margin-bottom:18px;
}
.fineart-pullquote__text{
  font-family:var(--font-serif); font-weight:300;
  font-size:clamp(20px, 2.8vw, 30px); line-height:1.6; color:var(--ink); margin:0 0 18px;
}
.fineart-pullquote__src{ font-size:12px; letter-spacing:0.14em; color:var(--text-mute); text-transform:uppercase; }

/* 사이즈 다이어그램 — 비율 사각형 (③컷 촬영 전 임시) */
.fineart-sizes{
  display:flex; align-items:flex-end; justify-content:center; gap:clamp(14px, 3vw, 36px);
  margin:clamp(40px, 6vw, 72px) 0; flex-wrap:wrap;
}
.fineart-sizes__item{ text-align:center; }
.fineart-sizes__box{
  border:1.5px solid var(--ink); border-radius:3px; background:var(--paper);
  margin:0 auto 10px; box-shadow:inset 0 0 0 6px var(--paper), inset 0 0 0 7px var(--line-soft);
}
.fineart-sizes__label{ font-size:12px; color:var(--text); font-weight:500; }
.fineart-sizes__dim{ font-size:11px; color:var(--text-mute); }

/* 클로징 밴드 — 수미상관 */
.fineart-closing{
  background:linear-gradient(160deg, var(--ink-2) 0%, var(--ink) 100%); color:#fff;
  margin:clamp(56px, 9vw, 110px) calc(50% - 50vw) 0;
  padding:clamp(56px, 9vw, 110px) max(var(--page-pad), calc(50vw - var(--page-w)/2));
  text-align:center;
}
.fineart-closing__title{
  font-family:var(--font-serif); font-weight:300;
  font-size:clamp(26px, 4vw, 44px); color:#fff; margin:0 0 14px;
}
.fineart-closing__sub{ font-size:14px; color:#94a3b8; letter-spacing:0.04em; }

/* H 증거 — 도록형 인용 카드 격상 */
.fineart-proof__case{
  font-family:var(--font-serif); font-size:15px; line-height:1.8;
  border-left:2px solid var(--accent);
}

/* 홈 카드 호버 — 절제된 줌 */
.woocommerce ul.products li.product a img{ transition:transform .5s ease, opacity .3s ease; }
.woocommerce ul.products li.product:hover a img{ transform:scale(1.02); opacity:1; }

/* 홈 콘텐츠 밴드 (2026-06-12) */
.fineart-stories{max-width:var(--page-w);margin:0 auto;padding:var(--section-gap) var(--page-pad);}
.fineart-stories__head{text-align:center;margin-bottom:40px;}
.fineart-stories__eyebrow{font-size:12px;letter-spacing:.22em;color:var(--accent);}
.fineart-stories__title{font-family:var(--font-serif);font-size:26px;color:var(--ink);margin:8px 0 0;font-weight:600;}
.fineart-stories__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.fineart-story-card{display:block;border:1px solid var(--line);border-radius:10px;padding:28px 24px;text-decoration:none;background:#fff;transition:border-color .2s;}
.fineart-story-card:hover{border-color:var(--accent);}
.fineart-story-card__title{font-family:var(--font-serif);font-size:18px;color:var(--ink);line-height:1.5;margin-bottom:12px;}
.fineart-story-card__ex{font-size:13.5px;color:var(--text);line-height:1.75;margin-bottom:16px;}
.fineart-story-card__more{font-size:13px;color:var(--accent);font-weight:700;}
.fineart-stories__links{text-align:center;margin-top:32px;}
.fineart-stories__links a{display:inline-block;margin:0 14px;font-size:14px;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:2px;}
@media(max-width:720px){.fineart-stories__grid{grid-template-columns:1fr;}}

/* 홈 밴드 높이 붕괴 방지 — Storefront 루프 컨텍스트 격리 (2026-06-12) */
.fineart-band, .fineart-stories{ clear:both; display:block; width:auto; float:none; min-height:1px; }
.site-main > .fineart-band, .site-main > .fineart-stories,
.col-full > .fineart-band, .col-full > .fineart-stories{ grid-column:1 / -1; }

/* Form A — 구매 라우팅 (2026-06-15) */
.site-header-cart, .fineart-handheld-footer-bar .cart{ display:none !important; }
.fineart-buy--single{ display:inline-block; background:var(--accent)!important; color:#fff!important; padding:14px 32px!important; border-radius:6px; font-size:15px; font-weight:700; }
.fineart-buy__note{ font-size:12px; color:var(--text-mute); margin-top:10px; }
.woocommerce ul.products li.product .fineart-buy{ display:inline-block!important; background:transparent!important; color:var(--accent)!important; border:1px solid var(--accent); padding:8px 16px!important; border-radius:5px; font-size:13px; margin-top:8px; }

/* 푸터 사업자정보 (전자상거래법 표시) */
.fineart-bizinfo{ font-size:12px; line-height:1.9; color:#94a3b8; text-align:center; } /* 다크 푸터: --text-mute(3.08 회귀)->#94a3b8(6.77) */
.fineart-bizinfo a{ color:#94a3b8; text-decoration:underline; }

/* ── 블로그 카드 그리드 (블로그·카테고리·태그·검색) ── */
.blog .site-main, .category .site-main, .tag .site-main, .search-results .site-main{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(258px,1fr)); gap:28px; align-items:start;
}
.blog .site-main > *:not(article), .category .site-main > *:not(article),
.tag .site-main > *:not(article), .search-results .site-main > *:not(article){ grid-column:1 / -1; }
.blog article.hentry, .category article.hentry, .tag article.hentry, .search-results article.hentry{
  border:1px solid var(--line); border-radius:10px; overflow:hidden; background:#fff; margin:0; padding:0;
  transition:border-color .2s, box-shadow .2s;
}
.blog article.hentry:hover, .category article.hentry:hover, .tag article.hentry:hover, .search-results article.hentry:hover{
  border-color:var(--accent); box-shadow:0 6px 22px rgba(28,26,23,.06);
}
.fineart-card__thumb{ display:block; }
.fineart-card__thumb img{ width:100%; height:200px; object-fit:cover; display:block; margin:0; }
.blog article.hentry .entry-header, .category article.hentry .entry-header,
.tag article.hentry .entry-header, .search-results article.hentry .entry-header{ padding:18px 20px 0; margin:0; }
.blog article.hentry .entry-title, .category article.hentry .entry-title,
.tag article.hentry .entry-title, .search-results article.hentry .entry-title{ font-size:18px; line-height:1.45; margin:0 0 8px; }
.blog article.hentry .entry-title a, .category article.hentry .entry-title a{ color:var(--ink); }
.blog article.hentry .entry-meta, .category article.hentry .entry-meta{ font-size:11.5px; color:var(--text-mute); }
.fineart-card__ex{ padding:10px 20px 0; margin:0; font-size:14px; color:var(--text); line-height:1.7; }
.fineart-card__more{ display:inline-block; padding:12px 20px 20px; color:var(--accent); font-weight:700; font-size:13px; text-decoration:none; }

/* ── 홈 차별화 스트립 (히어로 직후) ── */
.fineart-why{ max-width:1000px; margin:0 auto; padding:44px 20px 12px; text-align:center; }
.fineart-why__lead{ font-family:var(--font-serif); font-size:20px; line-height:1.65; color:var(--ink); margin:0 0 30px; }
.fineart-why__lead strong{ color:var(--accent); font-weight:600; }
.fineart-why__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:22px; }
.fineart-why__t{ font-family:var(--font-serif); font-size:15px; color:var(--accent); margin-bottom:6px; }
.fineart-why__d{ font-size:13px; color:var(--text); line-height:1.6; }