/* MASTER RC × 異物 活動頁：入伍第一天。
   配色取自營舍熄燈後：帶綠的夜操黑、戰壕綠、迷彩綠，麻繩色當唯一的輔色，漆白寫字。
   黃銅只給 CTA 按鈕，像軍服上唯一會反光的銅扣。
   字體：明體 900 是軍令與公文的口氣；數字與代號用噴漆模板字（軍品木箱上的編號）。
   根元素是 .kol.kol-rc：先載 kol-base.css（版寬 --kol-max、購買盒骨架），這裡覆寫成營舍配色。
   內容一律不超出置中的 1200px 軌道；滿版的只有區塊背景。 */
.kol-rc {
  --rc-night: #121510;      /* 夜操黑：底色 */
  --rc-trench: #20261A;     /* 戰壕綠：區塊底 */
  --rc-camo: #4B5237;       /* 迷彩綠：線與框 */
  --rc-hemp: #A99F86;       /* 麻繩：編號、底線、圖框線（刻意比黃銅灰，避免看起來像金色） */
  --rc-paint: #E8E4D8;      /* 漆白：標題 */
  --rc-text: #C2BFB2;
  --rc-mute: #8A8A78;
  --rc-serif: 'Noto Serif TC', 'Songti TC', serif;
  --rc-sans: 'Noto Sans TC', 'PingFang TC', system-ui, sans-serif;
  --rc-stencil: 'Big Shoulders Stencil', 'Noto Sans TC', sans-serif;
  --rc-gap: clamp(6.4rem, 10vw, 14rem);
  --rc-ease: cubic-bezier(.22, 1, .36, 1);

  position: relative;
  isolation: isolate;
  overflow-x: clip;
  background: var(--rc-night);
  color: var(--rc-text);
  font-family: var(--rc-sans);
  font-size: 1.6rem;
  letter-spacing: .04em;
}
/* 消光顆粒：讓暗底像布料與漆面，不像螢幕 */
.kol-rc::before {
  content: '';
  position: absolute; inset: 0; z-index: 5; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity: .08;
  mix-blend-mode: overlay;
}
.kol-rc *, .kol-rc *::before, .kol-rc *::after { box-sizing: border-box; }
.kol-rc h1, .kol-rc h2, .kol-rc h3 {
  margin: 0; color: var(--rc-paint);
  font-family: var(--rc-serif); font-weight: 900; letter-spacing: .03em;
}
.kol-rc p { margin: 0; line-height: 1.95; text-wrap: pretty; }
.kol-rc h1, .kol-rc h2, .kol-rc .rc-code__detail, .kol-rc .rc-chapter--reward p { text-wrap: balance; }
.kol-rc ul, .kol-rc ol, .kol-rc dl { margin: 0; padding: 0; list-style: none; }
.kol-rc a { color: inherit; }
.kol-rc img, .kol-rc video { display: block; max-width: 100%; height: auto; }
.kol-rc .rc-stencil { font-family: var(--rc-stencil); font-weight: 800; letter-spacing: .02em; }

/* ---- 共用元件 ---- */
.kol-rc .rc-btn,
body .kol-rc .button.button--primary {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 5.2rem; padding: 0 3.2rem;
  border: 0; border-radius: 2px;
  /* 黃銅：整頁唯一的金屬色 */
  background: linear-gradient(180deg, #D2B36C 0%, #A98A48 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 236, 190, .25), 0 1px 0 rgba(0, 0, 0, .5);
  color: #15130C;
  font-family: var(--rc-sans); font-size: 1.5rem; font-weight: 700; letter-spacing: .14em;
  text-decoration: none; cursor: pointer;
  transition: transform .2s var(--rc-ease), filter .2s var(--rc-ease);
}
body .kol-rc .button.button--primary::before,
body .kol-rc .button.button--primary::after { display: none; }
.kol-rc .rc-btn:hover,
body .kol-rc .button.button--primary:not([disabled]):hover { filter: brightness(1.08); transform: translateY(-1px); box-shadow: inset 0 0 0 1px rgba(255, 236, 190, .25), 0 1px 0 rgba(0, 0, 0, .5); }
.kol-rc .rc-btn:active,
body .kol-rc .button.button--primary:not([disabled]):active { filter: brightness(.94); transform: translateY(0); transition-duration: .08s; }
.kol-rc .rc-btn:focus-visible,
body .kol-rc .button.button--primary:focus-visible,
.kol-rc .rc-link:focus-visible,
.kol-rc .kol-buy a:focus-visible,
.kol-rc .kol-buy__select:focus-visible { outline: 2px solid var(--rc-paint); outline-offset: 3px; box-shadow: none; }
body .kol-rc .button.button--primary[disabled] { background: var(--rc-camo); color: var(--rc-mute); cursor: progress; }

.kol-rc .rc-link {
  display: inline-flex; align-items: center; min-height: 4.4rem;
  color: var(--rc-paint); font-size: 1.5rem; letter-spacing: .12em; text-decoration: none;
  background: linear-gradient(var(--rc-hemp), var(--rc-hemp)) 0 calc(100% - 1rem) / 100% 1px no-repeat;
  transition: color .2s var(--rc-ease);
}
.kol-rc .rc-link:hover { color: var(--rc-hemp); }

/* 章節：作息表的時間，入伍第一天從 0600 到 2200 */
.kol-rc .rc-eyebrow {
  display: flex; align-items: baseline; gap: 1.2rem;
  margin-bottom: 1.6rem; color: var(--rc-text);
  font-size: 1.5rem; font-weight: 500; letter-spacing: .2em;
}
.kol-rc .rc-eyebrow .rc-stencil { color: var(--rc-hemp); font-size: 3.2rem; line-height: 1; letter-spacing: .04em; }

/* ---- 不規則裁切圖片：同一組頂點裁圖並描一條錯位的麻繩色線 ---- */
.kol-rc .rc-shard { position: relative; margin: 0; isolation: isolate; }
.kol-rc .rc-shard__clip {
  position: relative; z-index: 1;
  clip-path: var(--rc-clip);
  overflow: hidden;
  background: var(--rc-trench);
  aspect-ratio: var(--rc-ratio, 4 / 3);
}
.kol-rc .rc-shard__img { width: 100%; height: 100%; object-fit: cover; object-position: var(--rc-focus, 50% 50%); }
.kol-rc .rc-shard__line {
  position: absolute; inset: 0; z-index: 0;
  width: 100%; height: 100%; overflow: visible;
  fill: none; stroke: var(--rc-hemp); stroke-width: 1; opacity: .45;
  transform: translate(1.2rem, 1.2rem);
}
.kol-rc .rc-shard--hero { --rc-ratio: 2 / 3; }
.kol-rc .rc-shard--tall { --rc-ratio: 3 / 5; --rc-focus: 50% 85%; }
.kol-rc .rc-shard--video { --rc-ratio: 4 / 3; }

/* ---- Hero ---- */
.rc-hero {
  position: relative;
  display: grid; align-items: center; gap: 3.2rem;
  padding: 3.2rem 2rem 6.4rem;
  /* 右上一盞營舍燈 */
  background: radial-gradient(80% 60% at 80% 18%, rgba(169, 159, 134, .09) 0%, transparent 62%);
}
.rc-hero__media { position: relative; z-index: 1; width: min(64vw, 40rem); margin: 0 auto; }
.rc-hero__copy { position: relative; z-index: 2; }
.kol-rc .rc-kicker {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .8rem;
  margin-bottom: 2.4rem; color: var(--rc-mute); font-size: 1.4rem; letter-spacing: .12em;
}
.kol-rc .rc-kicker .rc-stencil { color: var(--rc-hemp); font-size: 2rem; letter-spacing: .06em; }
.kol-rc .rc-hero__title {
  font-size: clamp(4rem, 9vw, 9.2rem); line-height: 1.14; letter-spacing: .04em;
  text-shadow: 0 2px 30px rgba(0, 0, 0, .7);
}
.kol-rc .rc-hero__lede { margin-top: 2.4rem; max-width: 46rem; font-size: 1.7rem; }
.rc-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.6rem 2.8rem; margin-top: 3.6rem; }
.kol-rc .rc-chip { margin-top: 3.2rem; color: var(--rc-text); font-size: 1.4rem; line-height: 1.6; }
.kol-rc .rc-chip strong { color: var(--rc-paint); font-size: 2.2rem; vertical-align: -.1em; }
.kol-rc .rc-age { margin-top: .8rem; font-size: 1.2rem; color: var(--rc-mute); }

@media (min-width: 990px) {
  .rc-hero {
    grid-template-columns: 7fr 5fr; gap: 4rem;
    min-height: min(100vh, 96rem);
    padding: 8rem max(clamp(4rem, 7vw, 12rem), calc((100% - var(--kol-max)) / 2));
  }
  .rc-hero__media { order: 2; width: min(100%, 46rem); }
}

/* ---- 軍規：一塊沒有裝飾的告示 ---- */
.rc-rules { position: relative; padding: var(--rc-gap) 2rem 0; }
.rc-plate {
  max-width: 104rem; margin: 0 auto;
  padding: 5.6rem 2.4rem;
  border-top: 2px solid var(--rc-hemp);
  background: rgba(32, 38, 26, .94);
}
.kol-rc .rc-rules__title { font-size: clamp(2.8rem, 4vw, 4rem); letter-spacing: .3em; text-align: center; }
.rc-rules__list { display: grid; gap: 3.2rem; margin-top: 4rem !important; }
.rc-rules__list li { display: grid; align-content: start; grid-template-columns: 5.6rem 1fr; column-gap: 1.6rem; font-size: 1.5rem; line-height: 1.85; }
.rc-rules__list strong { display: block; color: var(--rc-paint); font-family: var(--rc-serif); font-size: 2rem; font-weight: 900; margin-bottom: .4rem; }
.rc-rules__num {
  grid-row: span 2; align-self: start;
  font-family: var(--rc-serif); font-weight: 900; font-size: 4.4rem; line-height: 1; color: var(--rc-hemp);
}
@media (min-width: 990px) {
  .rc-plate { padding: 7.2rem 6.4rem; }
  .rc-rules__list { grid-template-columns: repeat(3, 1fr); gap: 4.8rem; }
  .rc-rules__list li { grid-template-columns: 1fr; }
  .rc-rules__num { grid-row: auto; margin-bottom: 1.6rem; }
}

/* ---- 章節 ---- */
.rc-chapter {
  display: grid; gap: 4.8rem; align-items: center;
  max-width: calc(var(--kol-max) + 4rem); margin: 0 auto;
  padding: var(--rc-gap) 2rem 0;
}
.kol-rc .rc-chapter h2, .kol-rc .rc-pao h2, .kol-rc .rc-kit h2 {
  font-size: clamp(3.2rem, 4.8vw, 5.6rem); line-height: 1.22; margin-bottom: 2.8rem;
}
.rc-chapter__copy > p + p, .rc-pao__copy > p + p { margin-top: 1.6rem; }
.rc-chapter__copy > p { max-width: 52rem; }
.rc-chapter__media { width: min(80vw, 46rem); margin: 0 auto; }
@media (min-width: 990px) {
  .rc-chapter { grid-template-columns: 5fr 6fr; gap: 9.6rem; }
  .rc-chapter__media { width: 100%; }
  /* 束縛：用具在文字下方、照片左邊；手機則排在照片後面 */
  .rc-chapter--bind { grid-template-columns: 5fr 7fr; row-gap: 0; align-items: start; }
  .rc-chapter--bind .rc-chapter__copy { grid-column: 1; grid-row: 1; }
  .rc-chapter--bind .rc-collage { grid-column: 2; grid-row: 1 / span 2; }
  .rc-chapter--bind .rc-gear { grid-column: 1; grid-row: 2; margin-top: 4rem; }
}

/* 束縛：三張碎片疊在一起 */
.rc-collage { display: grid; grid-template-columns: repeat(12, 1fr); }
.rc-collage__a { grid-column: 1 / 11; grid-row: 1; --rc-ratio: 5 / 3; z-index: 1; }
.rc-collage__b { grid-column: 5 / 13; grid-row: 2; margin-top: -12%; --rc-ratio: 16 / 9; z-index: 2; }
.rc-collage__c { grid-column: 1 / 7; grid-row: 3; margin-top: -16%; --rc-ratio: 6 / 5; z-index: 3; }
.rc-collage__b .rc-shard__clip, .rc-collage__c .rc-shard__clip { filter: drop-shadow(0 1.6rem 2.4rem rgba(0, 0, 0, .6)); }

/* 章節裡的用具：放在對應照片旁邊的小購買盒 */
.kol-rc .rc-gear .kol-buy { margin-top: 1.6rem; }
.rc-chapter--reward .rc-gear { width: 100%; max-width: 104rem; margin: 0 auto; }
@media (min-width: 990px) {
  .rc-gear--pair { display: grid; grid-template-columns: 1fr 1fr; column-gap: 3.2rem; }
  .rc-gear--pair .rc-gear__tag { grid-column: 1 / -1; }
}

/* ---- 教具：阿炮 ---- */
.rc-pao {
  position: relative;
  display: grid; gap: 4.8rem;
  margin-top: var(--rc-gap);
  padding: var(--rc-gap) 2rem;
  background: var(--rc-trench);
}
.rc-pao__media, .rc-pao__copy { max-width: 60rem; width: 100%; margin: 0 auto; }
.kol-rc .rc-caption { margin-top: 2rem; color: var(--rc-mute); font-size: 1.3rem; letter-spacing: .12em; }
.kol-rc .rc-pao__line {
  margin-top: 2.8rem; padding-left: 1.6rem; border-left: 2px solid var(--rc-hemp);
  color: var(--rc-paint); font-family: var(--rc-serif); font-size: 2rem; font-weight: 700; line-height: 1.6;
}
.rc-spec { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; margin-top: 3.6rem !important; }
.rc-spec div { padding-top: 1.2rem; border-top: 1px solid var(--rc-camo); }
.rc-spec dt { color: var(--rc-mute); font-size: 1.3rem; letter-spacing: .16em; }
.rc-spec dd { margin: .4rem 0 0; color: var(--rc-mute); font-size: 1.4rem; }
/* 規格數字：噴在木箱上的尺寸 */
.rc-spec dd .rc-stencil { margin-right: .4rem; color: var(--rc-paint); font-size: clamp(4rem, 6vw, 5.6rem); line-height: 1; }
.rc-tags { display: flex; flex-wrap: wrap; margin-top: 2.4rem !important; color: var(--rc-paint); font-size: 1.4rem; }
.rc-tags li:not(:last-child)::after { content: '、'; color: var(--rc-mute); }
.kol-rc .rc-fine { margin-top: 1.2rem; color: var(--rc-mute); font-size: 1.3rem; }
.kol-rc .rc-code-hint { margin-top: 1.6rem; color: var(--rc-mute); font-size: 1.4rem; }
.kol-rc .rc-code-hint strong { color: var(--rc-paint); font-size: 2.2rem; vertical-align: -.1em; }
@media (min-width: 990px) {
  .rc-pao { grid-template-columns: 6fr 5fr; gap: 8rem; padding-inline: max(clamp(4rem, 7vw, 12rem), calc((100% - var(--kol-max)) / 2)); align-items: start; }
  .rc-pao__media { position: sticky; top: 10rem; max-width: none; }
}

/* ---- 賞罰：四張碎片拼貼 ---- */
.rc-chapter--reward { grid-template-columns: 1fr !important; gap: 5.6rem; }
.rc-chapter--reward .rc-chapter__copy { max-width: 64rem; margin: 0 auto; text-align: center; }
.rc-chapter--reward .rc-eyebrow { justify-content: center; }
.rc-chapter--reward .rc-chapter__copy > p { margin-inline: auto; }
.rc-mosaic { display: grid; grid-template-columns: repeat(6, 1fr); gap: 2.4rem 1.6rem; }
.rc-mosaic__a { grid-column: 1 / 4; --rc-ratio: 1 / 1; }
.rc-mosaic__b { grid-column: 4 / 7; --rc-ratio: 1 / 1; margin-top: 4.8rem; }
.rc-mosaic__c { grid-column: 1 / 7; --rc-ratio: 16 / 9; }
.rc-mosaic__d { grid-column: 1 / 7; --rc-ratio: 16 / 9; }
@media (min-width: 990px) {
  .rc-mosaic { grid-template-columns: repeat(12, 1fr); gap: 3.2rem; align-items: start; }
  .rc-mosaic__a { grid-column: 1 / 4; margin-top: 8rem; }
  .rc-mosaic__b { grid-column: 4 / 7; margin-top: 0; }
  .rc-mosaic__c { grid-column: 7 / 13; margin-top: 4rem; }
  .rc-mosaic__d { grid-column: 3 / 10; margin-top: -2rem; }
}

/* ---- 配給 ---- */
.rc-kit { max-width: calc(var(--kol-max) + 4rem); margin: 0 auto; padding: var(--rc-gap) 2rem 0; }
.rc-kit__head { text-align: center; }
.rc-kit__head .rc-eyebrow { justify-content: center; }
.kol-rc .rc-kit__head h2 { margin-bottom: 0; }
.rc-kit__grid { display: grid; gap: 4.8rem; margin-top: 4.8rem; }
.kol-rc .rc-kit__tag, .kol-rc .rc-gear__tag { color: var(--rc-hemp); font-size: 1.5rem; font-weight: 700; letter-spacing: .2em; }
.kol-rc .rc-kit__why { margin-top: 1.2rem; max-width: 52rem; }
@media (min-width: 990px) {
  .rc-kit__grid { grid-template-columns: 1fr 1fr; gap: 6.4rem; }
}

/* ---- 購買盒（共用 kol-buy-box 的 markup，在這頁換成戰壕綠；只有加入購物車是黃銅） ---- */
.kol-rc .kol-buy {
  display: grid; grid-template-columns: 9.6rem 1fr; gap: 1.6rem; align-items: center;
  margin-top: 2.8rem; padding: 1.6rem;
  border-radius: 2px;
  background: var(--rc-trench); box-shadow: none;
}
.kol-rc .kol-buy__media { display: block; overflow: hidden; background: #fff; border-radius: 1px; }
.kol-rc .kol-buy__media img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.kol-rc .kol-buy__title { color: var(--rc-paint); font-family: var(--rc-serif); font-size: 1.8rem !important; font-weight: 700; line-height: 1.45; }
.kol-rc .kol-buy__title a { text-decoration: none; }
.kol-rc .kol-buy__title a:hover { text-decoration: underline; text-decoration-color: var(--rc-hemp); text-underline-offset: .4rem; }
.kol-rc .kol-buy__note { margin-top: .6rem !important; color: var(--rc-mute); font-size: 1.3rem; line-height: 1.7 !important; }
.kol-rc .kol-buy__price { margin-top: .8rem !important; font-family: var(--rc-sans); color: var(--rc-paint); font-size: 2rem; font-weight: 700; letter-spacing: .02em; line-height: 1.4; }
.kol-rc .kol-buy__price s { margin-left: .8rem; color: var(--rc-mute); font-size: 1.4rem; font-weight: 500; }
.kol-rc .kol-buy__form { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.4rem; }
.kol-rc .kol-buy__select {
  flex: 1 1 14rem; min-height: 4.8rem; padding: 0 1.2rem;
  border: 1px solid var(--rc-camo); border-radius: 2px;
  background: var(--rc-night); color: var(--rc-paint);
  font: inherit; font-size: 1.4rem;
}
body .kol-rc .kol-buy__add { flex: 1 1 14rem; min-height: 4.8rem; padding: 0 1.6rem; white-space: nowrap; letter-spacing: .1em; }
body .kol-rc .kol-buy__add.is-loading { opacity: .6; }
.kol-rc .kol-buy__soldout { margin-top: 1rem !important; color: var(--rc-mute); font-size: 1.4rem; }
.kol-rc .kol-buy--feature { grid-template-columns: 1fr; padding: 2rem; }
@media (min-width: 750px) {
  .kol-rc .kol-buy { grid-template-columns: 12rem 1fr; }
  .kol-rc .kol-buy--feature { grid-template-columns: 16rem 1fr; }
}

/* ---- 折扣碼：噴在箱子上的大字 ---- */
.rc-code {
  max-width: 76rem; margin: var(--rc-gap) max(2rem, calc((100% - 76rem) / 2)) 0;
  padding: 5.6rem 2.4rem; text-align: center;
  background: var(--rc-trench);
}
.kol-rc .rc-code__label { color: var(--rc-hemp); font-size: 1.5rem; letter-spacing: .3em; }
.kol-rc .rc-code__value { margin: 1.6rem 0 2rem; color: var(--rc-paint); font-size: clamp(12rem, 26vw, 22rem); line-height: .9; }
.kol-rc .rc-code__detail { color: var(--rc-text); font-size: 1.6rem; }

/* ---- 結尾 ---- */
.rc-outro { max-width: calc(var(--kol-max) + 4rem); margin: 0 auto; padding: var(--rc-gap) 2rem calc(var(--rc-gap) * 1.2); text-align: center; }
.rc-outro .rc-eyebrow { justify-content: center; }
.kol-rc .rc-outro__title { font-size: clamp(7.2rem, 16vw, 16rem); line-height: 1.1; letter-spacing: .12em; }
.kol-rc .rc-outro__copy > p { margin-top: 1.6rem; font-size: 1.8rem; color: var(--rc-text); }
.rc-outro__actions { justify-content: center; }

.rc-extra { max-width: 80rem; margin: 0 auto; padding: 0 2rem var(--rc-gap); color: var(--rc-text); }