.bf-article {
  --article-ink: #2d2d2b;
  --article-accent: #9b371f;
  color: var(--article-ink);
  background: #fff;
  font-family: "Poppins", sans-serif;
  font-size: 17px;
  line-height: 1.85;
}
.bf-article__wrap { width: min(1140px, calc(100% - 40px)); margin-inline: auto; }
.bf-article__header { padding: 34px 0 48px; background: #f4f1ed; }
.bf-article a { color: var(--article-accent); font: inherit; text-decoration: underline; text-underline-offset: .2em; }
.bf-article a:hover { color: #692b1d; }
.bf-article a:focus-visible { outline: 3px solid var(--article-accent); outline-offset: 5px; }
.bf-article__breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 5px 12px; list-style: none; margin: 0 0 32px; padding: 0; font-size: 13px; }
.bf-article__breadcrumbs li + li::before { content: "/"; margin-right: 12px; color: #7c736b; }
.bf-article__eyebrow { margin: 0 0 14px; color: var(--article-accent); font-size: 13px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; }
.bf-article h1 { max-width: 1050px; margin: 0 0 18px; color: var(--article-ink); font-family: "Bakbak One", sans-serif; font-size: clamp(34px, 4.6vw, 58px); font-weight: 400; line-height: 1.12; text-wrap: balance; }
.bf-article__subtitle { max-width: 800px; margin: 0 0 24px; font-family: "Roboto Slab", serif; font-size: clamp(19px, 2vw, 24px); line-height: 1.5; }
.bf-article__meta { display: flex; flex-wrap: wrap; gap: 0 8px; margin: 0; font-size: 14px; }
.bf-article__figure { margin: 36px 0 40px; }
.bf-article__figure img { display: block; width: 100%; height: auto; aspect-ratio: 2.4 / 1; object-fit: cover; object-position: center 66%; border-radius: 0; }
.bf-article__figure figcaption { margin-top: 8px; color: #645d57; font-size: 12px; }
.bf-article__layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 70px; padding-bottom: 70px; }
.bf-article__contents { align-self: start; padding: 22px 20px; background: #f4f1ed; border-top: 3px solid var(--article-accent); font-size: 14px; line-height: 1.65; }
.bf-article__contents p { margin: 0 0 16px; font-weight: 600; }
.bf-article__contents ol { margin: 0; padding-left: 20px; }
.bf-article__contents li + li { margin-top: 14px; }
.bf-article__body { min-width: 0; }
.bf-article__body p { margin: 0 0 23px; }
.bf-article__body h2 { margin: 44px 0 18px; color: var(--article-ink); font-family: "Bakbak One", sans-serif; font-size: clamp(25px, 2.8vw, 34px); font-weight: 400; line-height: 1.25; scroll-margin-top: 180px; }
.bf-article__body ul { padding-left: 24px; margin: 0 0 26px; }
.bf-article__body li + li { margin-top: 10px; }
.bf-article__related { margin-top: 42px; border-top: 1px solid #d9d1c9; }
.bf-article__related h2 { margin-top: 28px; }
.bf-article__back { padding-top: 16px; font-weight: 600; }
@media (max-width: 900px) {
  .bf-article__layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .bf-article__contents ol { columns: 2; column-gap: 40px; }
  .bf-article__contents li { break-inside: avoid; }
  .bf-article__body { max-width: 760px; }
}
@media (max-width: 600px) {
  .bf-article { font-size: 16px; }
  .bf-article__header { padding: 24px 0 30px; }
  .bf-article__breadcrumbs ol { margin-bottom: 26px; }
  .bf-article__figure { margin: 24px 0; }
  .bf-article__figure img { aspect-ratio: 3 / 2; }
  .bf-article__contents ol { columns: 1; }
  .bf-article__body h2 { scroll-margin-top: 125px; }
  .bf-article__layout { padding-bottom: 40px; }
}
.bf-article__summary { margin: 0 0 32px; padding: 22px 26px 6px; background: #f4f1ed; border-left: 4px solid var(--article-accent); }
.bf-article__body .bf-article__summary h2 { margin: 0 0 12px; font-size: 22px; }
.bf-article__body ol { padding-left: 24px; margin: 0 0 26px; }
.bf-article__body h3 { margin: 30px 0 10px; color: var(--article-ink); font-size: 19px; line-height: 1.35; }
.bf-article__faq { margin-top: 44px; }
.bf-article__sources { font-size: 14px; color: #645d57; }
