/* ==========================================================================
   リニューアル案A — TOP（front-page.php）
   デザイン正本: clients/barrel-polish/design/2026-10-06_renewal/build_a.py（キャンバス v16）
   PC は 1440px 基準。901px 以下は1列に組み替え、斜めの段ずらしは控えめにする
   ========================================================================== */

/* 全幅（.rn-bleed）の横はみ出しはページ側で切る。.rn-front で切ると全幅の帯まで切れる */
body.home { overflow-x: clip; }
.rn-front { position: relative; }
.rn-front > section, .rn-front > div { box-sizing: border-box; }
:where(.rn-front) :where(h2, h3, p, figure, ul, ol, dl, dd) { margin: 0; padding: 0; }
:where(.rn-front) :where(ul, ol) { list-style: none; }
/* :where で詳細度を0にし、ボタン・カードの色指定を優先させる */
:where(.rn-front) a { text-decoration: none; color: inherit; }
:where(.rn-front) img { display: block; max-width: none; }
.rn-front .rn-inner, .rn-front .rn-section__head { position: relative; z-index: 1; }
.rn-align-right { text-align: right; }
.rn-link--dark { color: #fff; border-bottom-color: rgba(255, 255, 255, 0.6); }
.rn-link--dark .rn-arrow, .rn-dark .rn-more .rn-arrow { color: var(--rn-gold-on-dark); }
.rn-title--m { font-size: clamp(28px, 3vw, 44px); }

/* --------------------------------------------------------------------------
   FV（写真は切り口より右の表示域に収め、写真の中心＝表示域の中心）
   切り口: 上端 x=870/1440、60°で下へ（高さ760px → 下端 x=431）
   -------------------------------------------------------------------------- */
.rn-fv {
  --fv-h: 760px;
  --fv-top: 60.4vw;                                   /* 切り口の上端（870/1440） */
  --fv-bot: calc(var(--fv-top) - var(--fv-h) * 0.57735);
  position: relative; height: var(--fv-h); background: var(--rn-ink); color: #fff; overflow: hidden;
}
.rn-fv__wm { left: -12px; bottom: -34px; font-size: clamp(160px, 21vw, 300px); -webkit-text-stroke-color: rgba(255, 255, 255, 0.07); }
.rn-fv__photo { position: absolute; inset: 0; }
.rn-fv__window {
  position: absolute; inset: 0; background: var(--rn-ink2);
  clip-path: polygon(var(--fv-top) 0, 100% 0, 100% 100%, var(--fv-bot) 100%);
}
.rn-fv__slide { position: absolute; top: 0; bottom: 0; left: var(--fv-bot); right: 0; margin: 0; }
.rn-fv__slide img { width: 100%; height: 100%; object-fit: cover; }
.rn-fv__cap {
  position: absolute; right: 40px; bottom: 34px; display: flex; align-items: center; gap: 12px;
  padding: 8px 14px; background: rgba(17, 18, 20, 0.82); color: #fff; font-family: var(--rn-font-mono); font-size: 11px; letter-spacing: .04em;
}
.rn-fv__cap span { color: var(--rn-gold-on-dark); }
.rn-fv__line { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.rn-fv__body { position: absolute; left: var(--rn-pad); top: 116px; z-index: 2; width: min(760px, 52vw); }
.rn-fv .rn-label { color: var(--rn-gold-on-dark); }
.rn-fv__title { margin: 34px 0 0; color: #fff; line-height: 1.08; }
.rn-fv__title span { display: block; font-size: clamp(44px, 4.9vw, 70px); }
.rn-fv__title .rn-fv__title-l { font-size: clamp(72px, 8.5vw, 122px); letter-spacing: .04em; }
.rn-fv__lead { margin-top: 30px; font-size: 16px; line-height: 2; color: rgba(255, 255, 255, 0.84); }
.rn-fv__btns { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.rn-fv__btns .rn-btn { min-height: 58px; }
.rn-fv__fig { position: absolute; left: var(--rn-pad); bottom: 40px; z-index: 2; font-size: 11px; line-height: 1.5; color: var(--rn-gold-on-dark); }
.rn-fv__fig span { color: rgba(255, 255, 255, 0.6); letter-spacing: .04em; }
.rn-fv__scroll { position: absolute; left: 30px; bottom: 0; z-index: 2; display: none; flex-direction: column; align-items: center; gap: 12px; }
.rn-fv__scroll span { writing-mode: vertical-rl; font-size: 10px; color: rgba(255, 255, 255, 0.6); }
.rn-fv__scroll i { position: relative; width: 1px; height: 84px; background: rgba(255, 255, 255, 0.16); }
.rn-fv__scroll b { position: absolute; inset: 0; background: var(--rn-gold); }

/* お知らせ帯 */
.rn-news { background: var(--rn-ink2); border-top: 1px solid rgba(179, 143, 45, 0.5); color: #fff; }
.rn-news__inner { display: flex; align-items: center; gap: 26px; min-height: 64px; }
.rn-news__badge { padding: 3px 10px; border: 1px solid var(--rn-gold-on-dark); color: var(--rn-gold-on-dark); font-size: 11px; }
.rn-news__date, .rn-news__cat { font-size: 13px; color: rgba(255, 255, 255, 0.7); }
.rn-news__title { flex: 1; min-width: 0; font-size: 14px; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rn-news__title:hover { text-decoration: underline; }
.rn-news__all { display: flex; align-items: center; gap: 10px; font-size: 12px; color: #fff; }
.rn-news__all .rn-arrow { width: 14px; color: var(--rn-gold-on-dark); }

/* --------------------------------------------------------------------------
   §01 3列の柱（60°の平行四辺形・上端を一段ずつ下げる）
   -------------------------------------------------------------------------- */
.rn-pillars { display: flex; justify-content: center; gap: 10px; margin-top: 56px; padding: 0 87px 0 0; }
.rn-pillar {
  --bg: var(--rn-ink); --fg: #fff; --sub: rgba(255, 255, 255, 0.72); --acc: var(--rn-gold-on-dark);
  position: relative; display: block; width: 372px; height: 300px; flex-shrink: 1; min-width: 0;
  transform: skewX(-30deg); background: var(--bg); color: var(--fg); box-sizing: border-box; transition: filter .2s;
}
.rn-pillar--1 { --bg: #fff; --fg: var(--rn-ink); --sub: rgba(17, 18, 20, 0.72); --acc: var(--rn-ink); margin-top: 56px; border: 1px solid rgba(17, 18, 20, 0.22); }
.rn-pillar--2 { --bg: var(--rn-ink2); margin-top: 112px; }
.rn-pillar:hover { filter: brightness(1.12); }
.rn-pillar__body { position: absolute; inset: 0; padding: 34px 0 0 110px; transform: skewX(30deg); }
.rn-pillar__num { display: block; font-size: 76px; font-weight: 300; line-height: 1; color: transparent; -webkit-text-stroke: 1px var(--acc); }
.rn-pillar__en { display: block; margin-top: 18px; font-size: 11px; color: var(--sub); }
.rn-pillar__title { margin-top: 4px; font-size: 27px; line-height: 1.4; color: var(--fg); }
.rn-pillar__desc { margin-top: 8px; font-size: 13.5px; line-height: 1.8; color: var(--sub); }
.rn-pillar__more { position: absolute; right: 106px; bottom: 26px; display: flex; align-items: center; gap: 10px; transform: skewX(30deg); font-size: 13px; font-weight: 700; }
.rn-pillar__more .rn-arrow { width: 16px; color: var(--acc); }

/* --------------------------------------------------------------------------
   §02 強み（行の左端を60°の斜面に沿って右へ）
   -------------------------------------------------------------------------- */
.rn-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px; width: min(640px, 100%); }
.rn-fact { padding-left: 18px; border-left: 1px solid rgba(255, 255, 255, 0.18); }
.rn-fact__num { font-size: 44px; font-weight: 500; line-height: 1; color: #fff; }
.rn-fact__num small { margin-left: 4px; font-family: var(--rn-font-body); font-size: 14px; font-weight: 700; }
.rn-fact dd b { display: block; margin-top: 10px; font-size: 12.5px; color: #fff; }
.rn-fact dd span { display: block; margin-top: 2px; font-size: 10px; letter-spacing: .04em; color: rgba(255, 255, 255, 0.55); }
.rn-stair { --row: 132px; position: relative; margin: 64px 0 40px; border-bottom: 1px solid rgba(255, 255, 255, 0.14); }
.rn-stair::before { /* 滑り層の金の斜線 */
  content: ""; position: absolute; left: -18px; top: 0; width: 1.5px; height: 100%; background: var(--rn-gold);
  transform-origin: top left; transform: skewX(30deg);
}
.rn-stair__row {
  display: flex; align-items: center; gap: 36px; min-height: var(--row);
  margin-left: calc(var(--i) * var(--row) * 0.57735); border-top: 1px solid rgba(255, 255, 255, 0.14);
}
.rn-stair__num { width: 92px; flex-shrink: 0; font-size: 64px; font-weight: 500; line-height: 1; color: var(--rn-gold-on-dark); }
.rn-stair__name { width: 300px; flex-shrink: 0; }
.rn-stair__name span { display: block; font-size: 11px; color: rgba(255, 255, 255, 0.55); }
.rn-stair__name h3 { margin-top: 4px; font-size: 30px; line-height: 1.35; color: #fff; }
.rn-stair__desc { flex: 1; min-width: 0; font-size: 14px; line-height: 1.9; color: rgba(255, 255, 255, 0.78); }
.rn-stair__img { width: 176px; height: 108px; object-fit: cover; flex-shrink: 0; }

/* --------------------------------------------------------------------------
   §03 研磨事例（大1＋小4）
   -------------------------------------------------------------------------- */
.rn-cases { display: flex; gap: 48px; margin-top: 56px; }
.rn-case-big { position: relative; display: block; width: 51%; flex-shrink: 0; }
.rn-case-big__img { height: 440px; overflow: hidden; background: var(--rn-paper); }
.rn-case-big__img img, .rn-case-card__img img, .rn-col-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.rn-case-big:hover img, .rn-case-card:hover img, .rn-col-card:hover img { transform: scale(1.04); }
.rn-case-big__card { position: relative; width: 85%; margin: -64px 0 0 56px; padding: 30px 34px 32px; background: var(--rn-ink); color: #fff; box-sizing: border-box; }
.rn-case-big__meta, .rn-case-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; }
.rn-case-big__meta > span:last-child { font-size: 11px; letter-spacing: .04em; color: rgba(255, 255, 255, 0.65); }
.rn-case-big__card h3 { margin-top: 14px; font-size: 25px; line-height: 1.5; }
.rn-tag { padding: 2px 8px; background: var(--rn-ink); color: #fff; font-size: 10.5px; }
.rn-tag--gold { background: none; border: 1px solid var(--rn-gold-on-dark); color: var(--rn-gold-on-dark); font-size: 11px; }
.rn-case-grid { flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; row-gap: 34px; align-content: start; }
.rn-case-card { display: block; }
.rn-case-card__img { height: 196px; overflow: hidden; background: var(--rn-paper); }
.rn-case-card__meta { margin-top: 14px; }
.rn-case-card__meta > span:last-child { font-size: 11px; letter-spacing: .04em; color: rgba(17, 18, 20, 0.6); }
.rn-case-card h3 { margin-top: 8px; font-size: 15px; font-weight: 700; line-height: 1.6; }

/* --------------------------------------------------------------------------
   §04 設備（全幅の写真帯・60°の平行四辺形）
   -------------------------------------------------------------------------- */
.rn-facilities { padding-bottom: 72px; }
.rn-band { display: flex; justify-content: center; gap: 8px; height: 400px; margin: 52px 0 0; }
.rn-band__panel { position: relative; width: 236px; flex: 0 0 236px; overflow: hidden; transform: skewX(-30deg); }
.rn-band__panel img { position: absolute; left: -125px; top: 0; width: 486px; height: 100%; object-fit: cover; transform: skewX(30deg); }
.rn-band__cap {
  position: absolute; left: 30px; bottom: 22px; transform: skewX(30deg); transform-origin: left bottom;
  padding: 7px 12px 8px; background: rgba(17, 18, 20, 0.88); line-height: 1.5; white-space: nowrap; font-size: 13.5px; font-weight: 700; color: #fff;
}
.rn-band__cap span { display: block; font-size: 10px; font-weight: 400; color: var(--rn-gold-on-dark); }
.rn-facilities__more { margin-top: 40px; }

/* --------------------------------------------------------------------------
   §05 測定（写真と文字を互い違い・引き出し線）
   -------------------------------------------------------------------------- */
.rn-inspect__grid {
  display: grid; grid-template-columns: 40fr 24fr 6fr 30fr; grid-template-rows: auto auto;
  column-gap: 32px; row-gap: 40px; align-items: start;
}
.rn-inspect__text { grid-column: 1; grid-row: 1; }
.rn-inspect__title { font-size: clamp(28px, 2.8vw, 40px); line-height: 1.45; }
.rn-shot { position: relative; }
.rn-shot img { width: 100%; object-fit: cover; }
.rn-shot--0 { grid-column: 2 / 3; grid-row: 1 / 3; }
.rn-shot--0 img { aspect-ratio: 312 / 400; }
.rn-shot--1 { grid-column: 3 / 5; grid-row: 1 / 3; margin-top: 76px; }
.rn-shot--1 img { aspect-ratio: 384 / 288; }
.rn-shot--2 { grid-column: 1; grid-row: 2; max-width: 400px; }
.rn-shot--2 img { aspect-ratio: 400 / 240; }
.rn-shot figcaption { position: relative; margin-top: 46px; padding-left: 40px; }
.rn-shot figcaption i { position: absolute; left: 24px; top: -42px; width: 1px; height: 30px; background: var(--rn-ink); }
.rn-shot figcaption i::before { content: ""; position: absolute; left: -3px; top: -4px; width: 7px; height: 7px; border-radius: 50%; background: var(--rn-gold); }
.rn-shot figcaption span { display: block; font-size: 11px; }
.rn-shot figcaption b { display: block; font-size: 16px; line-height: 1.6; }
.rn-shot figcaption small { display: block; font-size: 12.5px; color: rgba(17, 18, 20, 0.72); }

/* --------------------------------------------------------------------------
   §06〜08 業界・課題解決・加工プロセス
   -------------------------------------------------------------------------- */
.rn-split { display: flex; gap: 80px; }
.rn-split--gap { margin-top: 80px; }
.rn-split__head { width: 330px; flex-shrink: 0; }
.rn-more { display: inline-flex; align-items: center; gap: 10px; margin-top: 20px; font-size: 13.5px; font-weight: 700; color: #fff; }
.rn-more .rn-arrow { width: 14px; }
.rn-rows { flex: 1; min-width: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.14); }
.rn-rows a { display: flex; align-items: center; gap: 0 12px; min-height: 66px; padding: 10px 0; border-top: 1px solid rgba(255, 255, 255, 0.14); box-sizing: border-box; color: #fff; transition: background .2s; }
.rn-rows a:hover { background: rgba(255, 255, 255, 0.04); }
.rn-rows .rn-arrow { width: 16px; }
.rn-rows__num { width: 48px; flex-shrink: 0; font-size: 11px; color: var(--rn-gold-on-dark); }
.rn-rows__name { width: 220px; flex-shrink: 0; font-size: 21px; }
.rn-rows__text { flex: 1; font-size: 14px; color: rgba(255, 255, 255, 0.78); }
.rn-rows__date { width: 108px; flex-shrink: 0; font-size: 11.5px; color: rgba(255, 255, 255, 0.6); }
.rn-rows__tag { width: 108px; flex-shrink: 0; font-size: 11px; color: var(--rn-gold-on-dark); }
.rn-rows__title { flex: 1; font-size: 15px; font-weight: 700; }
.rn-steps { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px; margin-top: 48px; border-top: 1px solid rgba(201, 165, 74, 0.7); }
.rn-steps li { position: relative; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 14px; padding-top: 34px; }
.rn-steps .rn-mark { position: absolute; left: 0; top: -7px; width: 14px; height: 14px; }
.rn-steps__num { font-size: 40px; font-weight: 500; line-height: 1; }
.rn-steps h3 { font-size: 24px; }
.rn-steps p { width: 100%; margin-top: 14px; font-size: 13.5px; line-height: 1.95; color: rgba(255, 255, 255, 0.78); }

/* --------------------------------------------------------------------------
   §09 技術コラム（横スクロールのカルーセル。中央に来た1枚を強調）
   -------------------------------------------------------------------------- */
.rn-columns { padding: 72px 0 64px; }
.rn-carousel__nav { display: flex; gap: 12px; }
.rn-carousel__btn { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border: 1px solid var(--rn-ink); background: transparent; color: var(--rn-ink); cursor: pointer; }
.rn-carousel__btn[data-dir="-1"] .rn-arrow { transform: scaleX(-1); }
.rn-carousel__btn:hover { background: var(--rn-ink); color: #fff; }
.rn-carousel {
  display: flex; align-items: center; gap: 28px; margin-top: 40px; padding: 0 calc(50vw - 280px) 12px;
  overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth;
}
.rn-carousel::-webkit-scrollbar { display: none; }
.rn-col-card {
  display: flex; flex-direction: column; flex: 0 0 340px; scroll-snap-align: center;
  background: #fff; border: 1px solid rgba(17, 18, 20, 0.14); box-sizing: border-box; opacity: .72; transition: flex-basis .4s, opacity .4s, background .4s;
}
.rn-col-card__img { height: 150px; overflow: hidden; transition: height .4s; }
.rn-col-card__body { padding: 18px 22px 20px; }
.rn-col-card__body p { font-size: 10.5px; color: rgba(17, 18, 20, 0.6); }
.rn-col-card h3 { margin-top: 8px; font-size: 14.5px; font-weight: 700; line-height: 1.7; color: var(--rn-ink); }
.rn-col-card h3 small { font-size: inherit; font-weight: 400; }
.rn-col-card.is-center { flex-basis: 560px; background: var(--rn-ink); border-color: var(--rn-ink); opacity: 1; }
.rn-col-card.is-center .rn-col-card__img { height: 186px; }
.rn-col-card.is-center .rn-col-card__body { padding: 26px 36px; }
.rn-col-card.is-center .rn-col-card__body p { color: var(--rn-gold-on-dark); }
.rn-col-card.is-center h3 { font-family: var(--rn-font-head); font-weight: 900; font-size: 22px; line-height: 1.55; color: #fff; }
.rn-columns__more { margin-top: 32px; }
@media (prefers-reduced-motion: reduce) {
  .rn-carousel { scroll-behavior: auto; }
  .rn-col-card, .rn-col-card__img { transition: none; }
}

/* --------------------------------------------------------------------------
   タブレット（1100px 以下）
   -------------------------------------------------------------------------- */
@media (min-width: 1200px) {
  .rn-fv__scroll { display: flex; }
}
@media (max-width: 1240px) {
  .rn-stair__name { width: 220px; }
  .rn-stair__name h3 { font-size: 24px; }
  .rn-stair__img { display: none; }
  .rn-pillar__body { padding-left: 100px; }
  .rn-pillar__title { font-size: 23px; }
}
@media (max-width: 1100px) {
  .rn-fv__body { width: 56vw; }
  .rn-case-big { width: 100%; }
  .rn-cases { flex-direction: column; }
  .rn-split { flex-direction: column; gap: 32px; }
  .rn-split__head { width: auto; }
  .rn-stair__row { margin-left: calc(var(--i) * 40px); }
  .rn-stair::before { display: none; }
}

/* --------------------------------------------------------------------------
   スマホ（900px 以下）: 写真を上・文字を下に分け、斜めは写真の下端だけに残す
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  .rn-align-right { text-align: left; }
  .rn-section__head { align-items: flex-start; }

  .rn-fv { --fv-h: auto; height: auto; padding-bottom: 32px; }
  .rn-fv__photo { position: relative; height: 62vw; min-height: 240px; }
  .rn-fv__window { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 18vw)); }
  .rn-fv__slide { left: 0; }
  .rn-fv__cap { right: 16px; bottom: 16px; padding: 6px 10px; font-size: 10px; }
  .rn-fv__line { display: none; }
  .rn-fv__body { position: relative; left: auto; top: auto; width: auto; padding: 24px var(--rn-pad) 0; }
  .rn-fv__title { margin-top: 18px; }
  .rn-fv__title span { font-size: clamp(30px, 8.6vw, 44px); }
  .rn-fv__title .rn-fv__title-l { font-size: clamp(50px, 15vw, 76px); }
  .rn-fv__lead { margin-top: 18px; font-size: 14.5px; line-height: 1.9; }
  .rn-fv__lead br { display: none; }
  .rn-fv__btns { flex-direction: column; margin-top: 24px; }
  .rn-fv__btns .rn-btn { width: 100%; }
  .rn-fv__fig { display: none; }
  .rn-fv__wm { font-size: 140px; bottom: auto; top: 60vw; }

  .rn-news__inner { flex-wrap: wrap; gap: 6px 14px; padding-top: 14px; padding-bottom: 14px; }
  .rn-news__title { flex-basis: 100%; white-space: normal; }
  .rn-news__all { margin-left: auto; }

  .rn-pillars { flex-direction: column; gap: 14px; padding: 0; margin-top: 36px; }
  .rn-pillar, .rn-pillar--1, .rn-pillar--2 { width: auto; height: auto; margin: 0; transform: none; clip-path: polygon(0 0, 100% 0, calc(100% - 28px) 100%, 0 100%); }
  .rn-pillar--1 { border: 0; outline: 1px solid rgba(17, 18, 20, 0.22); outline-offset: -1px; }
  .rn-pillar__body { position: relative; padding: 24px 56px 20px 24px; transform: none; }
  .rn-pillar__num { font-size: 52px; }
  .rn-pillar__en { margin-top: 10px; }
  .rn-pillar__more { position: relative; right: auto; bottom: auto; padding: 0 24px 22px; transform: none; }

  .rn-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 18px; margin-top: 12px; }
  .rn-fact__num { font-size: 38px; }
  .rn-stair { margin-top: 40px; }
  .rn-stair__row { flex-wrap: wrap; gap: 6px 16px; margin-left: calc(var(--i) * 12px); padding: 22px 0; }
  .rn-stair__num { width: auto; font-size: 40px; }
  .rn-stair__name { width: auto; flex: 1; }
  .rn-stair__name h3 { font-size: 22px; }
  .rn-stair__desc { flex-basis: 100%; font-size: 13.5px; }
  .rn-stair__desc br { display: none; }

  .rn-cases { margin-top: 32px; gap: 32px; }
  .rn-case-big__img { height: 58vw; }
  .rn-case-big__card { width: auto; margin: -36px 0 0 16px; padding: 20px 20px 22px; }
  .rn-case-big__card h3 { font-size: 19px; }
  .rn-case-grid { column-gap: 14px; row-gap: 24px; }
  .rn-case-card__img { height: 30vw; }
  .rn-case-card h3 { font-size: 13.5px; }

  .rn-band { justify-content: flex-start; height: 260px; margin-top: 32px; padding: 0 var(--rn-pad) 0 calc(var(--rn-pad) + 75px); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .rn-band::-webkit-scrollbar { display: none; }
  .rn-band__panel { flex-basis: 200px; scroll-snap-align: center; }
  .rn-band__panel img { left: -85px; width: 370px; }
  .rn-band__cap { left: 18px; bottom: 16px; font-size: 12.5px; }

  .rn-inspect__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 14px; row-gap: 28px; }
  .rn-inspect__text { grid-column: 1 / 3; }
  .rn-inspect__text .rn-lead br, .rn-inspect__title br { display: none; }
  .rn-shot--0 { grid-column: 1; grid-row: auto; }
  .rn-shot--1 { grid-column: 2; grid-row: auto; margin-top: 40px; }
  .rn-shot--2 { grid-column: 1 / 3; grid-row: auto; max-width: none; }
  .rn-shot figcaption { margin-top: 36px; padding-left: 26px; }
  .rn-shot figcaption i { left: 12px; top: -32px; height: 22px; }
  .rn-shot figcaption b { font-size: 14px; }
  .rn-shot figcaption small { font-size: 11.5px; }

  .rn-split--gap { margin-top: 56px; }
  .rn-rows a { flex-wrap: wrap; padding: 14px 28px 14px 0; position: relative; }
  .rn-rows .rn-arrow { position: absolute; right: 0; top: 50%; margin-top: -8px; }
  .rn-rows__name { width: auto; font-size: 18px; }
  .rn-rows__text, .rn-rows__title { flex-basis: 100%; margin-top: 4px; font-size: 13px; }
  .rn-rows__title { font-size: 14px; }
  .rn-rows__date, .rn-rows__tag { width: auto; }
  .rn-steps { grid-template-columns: 1fr; gap: 0; margin-top: 32px; border-top: 0; border-left: 1px solid rgba(201, 165, 74, 0.7); }
  .rn-steps li { padding: 0 0 32px 26px; }
  .rn-steps .rn-mark { left: -7px; top: 6px; }
  .rn-steps__num { font-size: 32px; }
  .rn-steps h3 { font-size: 20px; }
  .rn-steps p br { display: none; }

  .rn-columns { padding: 56px 0; }
  .rn-carousel { padding: 0 var(--rn-pad) 12px; margin-top: 28px; gap: 14px; }
  .rn-col-card, .rn-col-card.is-center { flex-basis: 78vw; }
  .rn-col-card.is-center .rn-col-card__img, .rn-col-card__img { height: 42vw; }
  .rn-col-card.is-center .rn-col-card__body { padding: 18px 20px 20px; }
  .rn-col-card.is-center h3 { font-size: 17px; }
  .rn-carousel__btn { width: 44px; height: 44px; }
}