/* 브랜드: 검은 숯과 불빛 */
.b-hero { position: relative; height: 100svh; min-height: 560px; display: grid; place-content: center; justify-items: center; text-align: center; overflow: hidden; background: var(--char); }
.b-hero > .shade { background: radial-gradient(ellipse at center, rgba(14, 12, 10, .25), rgba(14, 12, 10, .72)); }
.b-hero__title { position: relative; padding-inline: var(--gutter); will-change: transform; transform-origin: 50% 46%; }
.b-hero__sub { position: relative; margin-top: 20px; color: #e1d9cd; }

.b-ch { background: var(--char); }
.b-ch__stick { position: relative; height: 100svh; overflow: hidden; }
.b-ch__mark { position: absolute; inset: 0; display: grid; place-items: center; font-size: clamp(120px, 26vw, 460px); color: rgba(245, 241, 234, .08); }
.b-ch__media { position: absolute; inset: 0; overflow: hidden; display: grid; place-items: center; background: #1c1411; will-change: clip-path; }
.b-ch__media .shade { background: linear-gradient(90deg, rgba(14, 12, 10, .78) 0, rgba(14, 12, 10, .1) 62%); }
.b-ch__plate { width: min(78vh, 62vw); height: auto; filter: drop-shadow(0 40px 60px rgba(0, 0, 0, .6)); justify-self: end; margin-right: 6vw; }
.b-ch__copy { position: absolute; left: var(--gutter); top: 50%; transform: translateY(-50%); display: grid; gap: 18px; width: min(50vw, 680px); }
.b-ch__copy .eyebrow { color: var(--ember-hi); }
.b-ch__copy .lead { color: #e1d9cd; max-width: 40ch; }

.b-nums { padding-block: clamp(90px, 12vw, 180px) clamp(60px, 7vw, 100px); display: grid; gap: clamp(30px, 4vw, 60px); background: var(--char); }
.b-nums__list { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); }
.b-nums__list li { padding: 26px 24px 0 0; display: grid; gap: 12px; align-content: start; }
.b-nums__list li + li { padding-left: 24px; border-left: 1px solid var(--line); }
.b-nums__v { font-size: clamp(60px, 8vw, 132px); line-height: 1; color: var(--ember-hi); }
.b-nums__v small { font-size: .3em; margin-left: 4px; color: var(--bone); }
.b-nums__list li > p:last-child { color: #cfc7bb; font-size: 15px; }

.b-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(12px, 1.6vw, 24px); height: 130vh; padding-inline: var(--gutter); overflow: hidden; background: var(--char); }
.b-col { display: grid; gap: clamp(12px, 1.6vw, 24px); align-content: center; }
.b-col img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--radius); }

.b-end { padding-block: clamp(110px, 18vh, 220px); display: grid; gap: 32px; justify-items: center; text-align: center; background: var(--char); }
.b-end .btn-row { justify-content: center; }

@media (max-width: 899px) {
  .b-ch__media .shade { background: linear-gradient(0deg, rgba(14, 12, 10, .9) 0, rgba(14, 12, 10, .15) 62%); }
  .b-ch__copy { top: auto; bottom: 96px; transform: none; width: auto; right: var(--gutter); }
  .b-ch__plate { width: 92vw; justify-self: center; margin: 0 0 30vh; }
  .b-nums__list { grid-template-columns: repeat(2, 1fr); border-top: 0; }
  .b-nums__list li, .b-nums__list li + li { padding: 20px 0 20px; border-left: 0; border-top: 1px solid var(--line); }
  .b-cols { height: 80vh; }
}