/* 26차 미리보기(2026-11-01 · ko-ver2) — 재식술: 과정 A안 확정(사진 전체가 보이는 카드) · 과정 · 대상 흰 바탕 · 대상 카드 아이콘 · ‘단 한 번!’ 좌우 균형 · 섹션 제목 통일(후기 제목 모양). 생성 batch-1101e/r26.py */

/* ───── 섹션 제목: 큰 윤곽 영문 + ‘// 영문 소제목’ + 굵은 제목(끝말 금색) — 네이버 후기 제목과 같은 모양 ───── */
.r26-hd { position: relative; }
.r26-hd__bg { position: absolute; left: 0; right: 0; top: -0.42em; z-index: 0; display: flex; justify-content: flex-start; overflow: hidden; margin: 0;
  font-size: clamp(64px, 9vw, 170px); line-height: 1; font-weight: 800; letter-spacing: .02em; white-space: nowrap; color: transparent; -webkit-text-stroke: 1px rgba(169,132,62,.22); pointer-events: none; }
.r26-hd--c { text-align: center; }
.r26-hd--c .r26-hd__bg { justify-content: center; }
.r26-hd__lab { position: relative; margin: 0; font-size: 15px; letter-spacing: .04em; color: #1b1916; }
.r26-hd__lab i { margin-right: 10px; font-style: normal; color: #a9843e; }
.r26-hd .r26-hd__t { position: relative; margin: 12px 0 0; font-size: clamp(32px, 22px + 2vw, 56px); line-height: 1.2; font-weight: 800; letter-spacing: -0.045em; color: #1b1916; }
.r26-hd .r26-hd__t em { font-style: normal; font-weight: 800; color: #a9843e; }
@media (max-width: 767px) { .r26-hd__lab { font-size: 14px; } }

/* ───── ‘단 한 번!’: 제목 + 치아 묶음은 원장 사진 왼쪽 자리의 가운데, 원장은 오른쪽(참고 배치) ───── */
@media (min-width: 1024px) {
  .r26-band { --d26w: clamp(300px, 27vw, 500px); --d26r: max(0px, calc((100% - var(--maxw, 1280px)) / 2 - 120px)); }
  .r26-band .r20-band__doc { width: var(--d26w); left: auto; right: var(--d26r); }
  /* 글 묶음 오른쪽 끝 = 원장 사진 왼쪽 끝 − 16px */
  .r26-band .r20-band__in { padding-right: calc(var(--d26r) + var(--d26w) + 16px - max(0px, (100% - var(--maxw, 1280px) - 2 * var(--gut)) / 2)); }
  .r26-band .r20-band__fig { width: min(100%, 900px); margin-inline: auto; padding-bottom: clamp(60px, 4vw, 90px);
    grid-template-columns: minmax(0, 1fr) clamp(220px, 16vw, 300px) minmax(0, 1fr); column-gap: clamp(20px, 2.4vw, 48px); }
}

/* ───── 과정 A안(확정): 흰 바탕 · 카드 안에 사진 전체가 보이게(잘리지 않게 줄임) ───── */
.r26-pa { background: #fff; }
.r26-pa .r25-pc { display: flex; flex-direction: column; padding: 22px 22px 24px; background: #1b1916; transition: background-color .4s; }
.r26-pa .r25-pc::before { content: none; }
.r26-pa .r25-pc__no { position: static; order: 0; margin-bottom: 16px; color: rgba(255,255,255,.8); }
.r26-pa .r25-pc > img { position: static; order: 1; flex: 1 1 0; min-height: 0; width: 100%; height: auto; object-fit: contain; transform: none; transition: none; }
.r26-pa .r25-pc:hover > img { transform: none; }
.r26-pa .r25-pc__in { position: static; order: 2; padding: 18px 0 0; }
.r26-pa .r25-pc:hover, .r26-pa .r25-pc:focus-within { background: #24201a; }
/* 마우스를 올리면: 사진은 흐려지고 설명이 아래에서 사진 위로 올라온다(사진이 작아지지 않게) */
@media (hover: hover) and (min-width: 768px) {
  .r26-pa .r25-pc { position: relative; }
  .r26-pa .r25-pc > img { transition: opacity .4s; }
  .r26-pa .r25-pc:hover > img, .r26-pa .r25-pc:focus > img, .r26-pa .r25-pc:focus-within > img { opacity: .12; }
  .r26-pa .r25-pc:hover .r25-pc__in, .r26-pa .r25-pc:focus .r25-pc__in, .r26-pa .r25-pc:focus-within .r25-pc__in { position: absolute; left: 22px; right: 22px; bottom: 24px; padding: 0; }
}
@media (max-width: 767px), (hover: none) {
  .r26-pa .r25-pc { aspect-ratio: auto; background: #1b1916; color: #fff; }
  .r26-pa .r25-pc > img { flex: none; aspect-ratio: 4 / 3; height: auto; }
  .r26-pa .r25-pc__no { color: rgba(255,255,255,.8); }
  .r26-pa .r25-pc__in { padding: 18px 0 0; }
  .r26-pa .r25-pc__ph { color: #e2c27f; }
  .r26-pa .r25-pc__ph small { color: rgba(255,255,255,.7); }
  .r26-pa .r25-pc__more p { color: rgba(255,255,255,.86); }
  .r26-pa .r25-pc__more .r25-pc__cap { color: rgba(255,255,255,.6); }
}

/* ───── 대상: 흰 바탕 · 카드 아래 아이콘 ───── */
.r26-tg { background: #fff; color: var(--ink, #1b1916); }
.r26-tg .r23-tg__sub { color: #5f5a52; }
.r26-tg .r25-tc { display: flex; flex-direction: column; gap: 16px; border-color: #e6dfd3; background: #faf8f4; }
.r26-tg .r25-tc:hover { border-color: #c9a96a; background: #fff; box-shadow: 0 18px 40px -26px rgba(40,30,15,.45); }
.r26-tg .r25-tc__no { color: #a9843e; }
.r26-tg .r25-tc__no::after { background: rgba(169,132,62,.6); }
.r26-tg .r25-tc h3 { color: #1b1916; }
.r26-tg .r25-tc::after { background: #a9843e; }
.r26-ic { display: block; width: clamp(48px, 3.6vw, 64px); height: clamp(48px, 3.6vw, 64px); margin-top: auto; align-self: flex-end; color: #a9843e; }
.r26-ic svg { display: block; width: 100%; height: 100%; }
.r26-tg .r21-tg__note { background: #f6f1e7; color: #4a4540; }
.r26-tg .btn--line { background: transparent; border-color: #c9a96a; color: #1b1916; }
.r26-tg .btn--line:hover { background: #a9843e; border-color: #a9843e; color: #fff; }
@media (max-width: 767px) { .r26-ic { width: 40px; height: 40px; } }
