.pg-ages__word { position: absolute; left: 0; right: 0; top: clamp(112px, 14vh, 150px); text-align: center; --pc-giant-size: min(30vw, 50vh); color: var(--pc-ink); }
.pg-ages__kids { position: absolute; bottom: 0; left: 0; right: 0; margin-inline: auto; height: min(60%, 620px); }

.tm-board__names { position: absolute; inset: clamp(112px, 15vh, 150px) var(--pc-gutter) auto; margin: 0; font: 700 clamp(34px, 4.4vw, 70px)/1.02 var(--pc-display); font-stretch: 72%; letter-spacing: -.025em; color: rgba(242, 236, 226, .16); text-wrap: balance; }
.tm-name { animation: tm-roll 24s linear infinite; animation-delay: calc(var(--i) * 1s - 24s); }
.tm-name--head { color: var(--pc-red); animation: none; }
@keyframes tm-roll { 0% { color: rgba(242, 236, 226, .16); } 2%, 7% { color: rgba(242, 236, 226, .92); } 11%, 100% { color: rgba(242, 236, 226, .16); } }
.tm-board__hanshi { position: absolute; bottom: 0; left: 0; right: 0; margin-inline: auto; height: min(76%, 700px); }

.tm-ranks { border-top: 1px solid var(--pc-line); }
.tm-rank { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(20px, 2.6vw, 40px); align-items: start; padding-block: clamp(18px, 1.7vw, 24px); border-bottom: 1px solid var(--pc-line); }
.tm-rank__label { grid-column: 1 / span 2; margin: 0; font: 600 15px/1.35 var(--body); letter-spacing: .02em; color: var(--pc-dim); }
.tm-rank__deg { display: block; margin-bottom: 6px; font: 800 clamp(40px, 4vw, 60px)/.9 var(--pc-display); font-stretch: 72%; letter-spacing: -.03em; color: var(--pc-ink); }
.tm-rank__deg--word { font-size: clamp(28px, 2.6vw, 38px); }
.tm-people { grid-column: 3 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px clamp(20px, 2.6vw, 40px); margin: 0; padding: 0; list-style: none; }
.tm-person p { margin: 0; }
.tm-person__name { margin-bottom: 4px; font: 700 clamp(21px, 1.7vw, 25px)/1.1 var(--pc-display); font-stretch: 86%; letter-spacing: -.01em; }
.tm-person__meta { margin-bottom: 8px; font-size: 15px; line-height: 1.4; color: var(--pc-dim); }
.tm-person__bio { font-size: 17px; line-height: 1.45; }
.tm-person--head { grid-column: 3 / span 6; }
.tm-person--head .tm-person__name { font-size: clamp(36px, 3.6vw, 56px); font-stretch: 76%; letter-spacing: -.025em; }
.tm-person--head .tm-person__bio { max-width: 26em; font-size: clamp(17px, 1.35vw, 20px); }
.tm-rank__photo { grid-column: 11 / -1; aspect-ratio: 1; }

.rv-hero__photo { position: absolute; inset: 0 0 0 auto; width: 42%; border-radius: 0; }
.rv-hero__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(16, 14, 13, .35) 0%, rgba(16, 14, 13, 0) 24%); }
.rv-hero__photo img { object-position: 50% 30%; }
.rv-hero__score { position: absolute; left: var(--pc-gutter); top: clamp(118px, 15vh, 160px); }
.rv-hero__num { --pc-giant-size: min(29vw, 52vh); color: var(--pc-ink); font-variant-numeric: tabular-nums; }
.rv-hero__stars { margin: 18px 0 0; font: 600 17px/1.3 var(--body); letter-spacing: .02em; color: var(--pc-dim-light); }
.rv-hero__stars .pc-red { letter-spacing: .12em; margin-right: 8px; }
.rv-hero .pc-hero__copy { padding-right: calc(42% + var(--pc-gutter)); }

.rv-board { padding-bottom: 0; overflow: hidden; }
.rv-board__grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(24px, 5vw, 80px); align-items: end; }
.rv-board__member { justify-self: center; width: min(100%, 500px); }
.rv-board__copy { padding-bottom: var(--pc-sec); }
.rv-board__prompt { margin: 0 0 clamp(18px, 2vw, 28px); font: 500 clamp(19px, 1.6vw, 24px)/1.3 var(--pc-display); color: var(--pc-dim); }
.rv-board__words { display: grid; grid-template-columns: repeat(2, max-content); gap: 0 clamp(24px, 3vw, 48px); margin: 0; padding: 0; list-style: none; font: 800 clamp(40px, 4.6vw, 72px)/.98 var(--pc-display); font-stretch: 72%; letter-spacing: -.035em; }

.ct-hero__wall img { object-position: 50% 45%; filter: var(--pc-grade) brightness(.42); }
.ct-hero__address { position: absolute; left: var(--pc-gutter); right: var(--pc-gutter); top: clamp(116px, 15vh, 160px); margin: 0; font: 800 min(13.4vw, 20.5vh)/.84 var(--pc-display); font-stretch: 70%; letter-spacing: -.04em; color: var(--pc-on-dark); }
.ct-hero__address > span { display: block; }

.ct-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(40px, 7vw, 120px); align-items: start; }
.ct-week-wrap { --ct-day: 144px; --ct-time: 187px; --ct-pad: 20px; }
.ct-week { table-layout: fixed; }
.ct-week th { width: var(--ct-day); }
.ct-week td:last-child { width: var(--ct-time); }
.ct-week__bar { position: relative; }
.ct-week__bar span { position: absolute; top: 50%; height: 8px; margin-top: -4px; left: calc(var(--ct-pad) + var(--a) * (100% - 2 * var(--ct-pad))); width: calc((var(--b) - var(--a)) * (100% - 2 * var(--ct-pad))); border-radius: 4px; background: var(--pc-ink); transform-origin: left; }
.ct-week .is-closed th, .ct-week .is-closed td { color: var(--pc-dim); }
.ct-week .is-today th, .ct-week .is-today td { color: var(--pc-red); font-weight: 600; }
.ct-week .is-today .ct-week__bar span { background: var(--pc-red); }
.ct-week .has-now .ct-week__bar::after { content: ""; position: absolute; top: 50%; left: calc(var(--ct-pad) + var(--now) * (100% - 2 * var(--ct-pad))); width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: var(--pc-paper); box-shadow: 0 0 0 3px var(--pc-red); animation: ct-pulse 2.4s var(--pc-ease) infinite; }
@keyframes ct-pulse { 0%, 100% { box-shadow: 0 0 0 3px var(--pc-red), 0 0 0 3px rgba(210, 33, 24, .4); } 50% { box-shadow: 0 0 0 3px var(--pc-red), 0 0 0 14px rgba(210, 33, 24, 0); } }
.ct-week__axis { position: relative; height: 22px; margin: 10px calc(var(--ct-time) + var(--ct-pad)) 0 calc(var(--ct-day) + var(--ct-pad)); font-size: 15px; color: var(--pc-dim); }
.ct-week__axis span { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; }
.ct-week__axis span:nth-child(1) { left: 0; }
.ct-week__axis span:nth-child(2) { left: 25%; }
.ct-week__axis span:nth-child(3) { left: 50%; }
.ct-week__axis span:nth-child(4) { left: 75%; }
.ct-week__axis span:nth-child(5) { left: 100%; }
.ct-reach { padding-top: 8px; }
.ct-reach p { margin: 0; }
.ct-reach__big { margin-bottom: 18px; font: 700 clamp(40px, 4.4vw, 64px)/1 var(--pc-display); font-stretch: 78%; letter-spacing: -.03em; }
.ct-reach__big a, .ct-reach__line a { text-decoration: none; }
.ct-reach__line { margin-bottom: 14px; font: 500 clamp(19px, 1.6vw, 24px)/1.3 var(--pc-display); }
.ct-reach__note { margin: 26px 0 22px; max-width: 30em; font-size: 17px; line-height: 1.55; color: var(--pc-dim); }
.ct-reach__links { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.ct-reach__links .pc-link { margin-top: 0; }

@media (max-width: 860px) {
  .pg-ages__word { top: clamp(170px, 24vh, 220px); --pc-giant-size: 27vw; }
  .pg-ages__kids { bottom: auto; top: clamp(250px, 35vh, 320px); width: 96%; height: auto; }
  .tm-board__names { top: 150px; font-size: clamp(26px, 7.4vw, 40px); line-height: 1.06; }
  .tm-board__hanshi { bottom: 210px; height: min(42%, 380px); }
  .tm-rank { grid-template-columns: minmax(0, 1fr); row-gap: 16px; }
  .tm-rank__label, .tm-people, .tm-person--head { grid-column: 1; }
  .tm-rank--head { grid-template-columns: minmax(0, 1fr) 34%; column-gap: 16px; }
  .tm-rank--head .tm-rank__label { grid-column: 1 / -1; }
  .tm-rank--head .tm-rank__photo { grid-column: 2; grid-row: 2; aspect-ratio: 3 / 4; }
  .tm-rank__deg { display: inline; margin: 0 8px 0 0; font-size: 34px; }
  .tm-rank__deg--word { font-size: 28px; }
  .tm-people { grid-template-columns: 1fr 1fr; gap: 18px 16px; }
  .tm-person__name { font-size: 19px; }
  .tm-people .tm-person__bio { display: none; }
  .rv-hero__photo { inset: clamp(330px, 42%, 380px) 0 0; width: 100%; }
  .rv-hero__photo::after { background: linear-gradient(180deg, rgba(16, 14, 13, 0) 20%, rgba(16, 14, 13, .6) 45%, rgba(16, 14, 13, .96) 80%); }
  .rv-hero__score { top: 150px; }
  .rv-hero__num { --pc-giant-size: 44vw; }
  .rv-hero .pc-hero__lead { color: var(--pc-on-dark); }
  .rv-hero .pc-hero__copy { padding-right: var(--pc-gutter); }
  .rv-hero .pc-hero__act { --pc-dim: var(--pc-dim-dark); color: var(--pc-on-dark); }
  .rv-hero .pc-hero__act .pc-proof { color: var(--pc-dim-dark); }
  .rv-board__grid { grid-template-columns: 1fr; }
  .rv-board__member { order: 2; width: 66%; }
  .rv-board__copy { padding-bottom: 0; }
  .ct-hero__address { top: 150px; font-size: 18.5vw; }
  .ct-grid { grid-template-columns: 1fr; }
  .ct-week-wrap { --ct-day: 92px; --ct-time: 160px; --ct-pad: 8px; }
  .ct-week { font-size: 15px; }
  .ct-week__axis span:nth-child(2), .ct-week__axis span:nth-child(4) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .tm-name { animation: none; color: rgba(242, 236, 226, .3); }
  .tm-name--head { color: var(--pc-red); }
}

.pp-crumb { position: absolute; z-index: 3; top: 100px; left: var(--pc-gutter); display: flex; gap: 10px; margin: 0; font-size: 15px; font-weight: 600; letter-spacing: .04em; color: var(--pc-on-dark); }
.pp-crumb a { color: var(--pc-dim-dark); text-decoration: none; transition: color .25s; }
.pp-crumb a:hover { color: var(--pc-red); }
.pp-crumb span[aria-hidden] { color: var(--pc-dim-dark); }
.pc-hero--paper .pp-crumb { color: var(--pc-ink); }
.pc-hero--paper .pp-crumb a, .pc-hero--paper .pp-crumb span[aria-hidden] { color: var(--pc-dim-light); }
.pp-gap { margin-bottom: 22px; }
.pp-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.pp-split__photo { aspect-ratio: 4 / 3; }
.pp-facts { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--pc-line); }
.pp-facts li { padding: 14px 0; border-bottom: 1px solid var(--pc-line); font-size: 17px; line-height: 1.5; }
.pp-quote { margin: 0; }
.pp-quote blockquote { margin: 0; }
.pp-quote p { max-width: 34em; margin: 0; font: 500 clamp(21px, 1.9vw, 28px)/1.3 var(--pc-display); font-stretch: 92%; letter-spacing: -.01em; text-indent: -.4em; text-wrap: pretty; }
.pp-quote--lg p { max-width: 22em; font-size: clamp(28px, 3.3vw, 48px); line-height: 1.1; font-stretch: 86%; letter-spacing: -.02em; }
.pp-quote--lg { margin-bottom: clamp(40px, 5vw, 72px); }
.pp-quote--after { margin-top: clamp(48px, 5vw, 80px); }
.pp-quotes { margin-top: clamp(48px, 5vw, 80px); }
.pp-quotes--top { margin-top: 0; }
.pp-more { margin-top: clamp(56px, 6vw, 96px); }
.pp-more__label { margin: 0 0 14px; font-size: 15px; letter-spacing: .04em; color: var(--pc-dim); }
.pp-more__links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(20px, 3vw, 48px); border-top: 1px solid var(--pc-line); }
.pp-more__link { display: flex; flex-direction: column; gap: 6px; padding: 18px 0 22px; border-bottom: 1px solid var(--pc-line); color: inherit; text-decoration: none; }
.pp-more__meta { font-size: 15px; letter-spacing: .04em; color: var(--pc-dim); }
.pp-more__name { font: 700 clamp(28px, 2.6vw, 40px)/1 var(--pc-display); font-stretch: 76%; letter-spacing: -.02em; transition: color .35s; }
.pp-more__link:hover .pp-more__name, .pp-more__link:focus-visible .pp-more__name { color: var(--pc-red); }

.jr-hero__ages { position: absolute; left: 0; right: 0; top: 44%; transform: translateY(-50%); text-align: center; --pc-giant-size: min(58vw, 72vh); }
.jr-hero__photo { display: inline-block; padding-top: .04em; background: url("https://images.gympropel.com/clients/port-credit-academy-of-martial-arts/site/v1/kids8.webp") 30% 40% / 140% auto no-repeat; -webkit-background-clip: text; background-clip: text; color: transparent; filter: var(--pc-grade) brightness(1.06); animation: jr-pan 26s ease-in-out infinite alternate; }
.jr-hero__and { display: inline-block; margin: 0 .2em; font-size: .12em; font-weight: 600; font-stretch: 100%; letter-spacing: 0; vertical-align: .7em; color: var(--pc-on-dark); }
@keyframes jr-pan { to { background-position: 70% 40%; } }
.jr-rails { margin-top: clamp(16px, 2vw, 32px); }
.jr-rail { padding-bottom: clamp(14px, 1.6vw, 24px); }
.jr-rail__who { margin: 0; font-size: 17px; font-weight: 600; }
.jr-rail__who span { margin-left: 10px; font-weight: 400; color: var(--pc-dim); }
.jr-rail__track { position: relative; height: clamp(54px, 5.6vw, 80px); }
.jr-rail__line { position: absolute; left: 0; bottom: 12px; width: var(--w); height: 4px; border-radius: 2px; background: var(--pc-ink); transform-origin: left; }
.jr-rail__line::before { content: ""; position: absolute; left: 0; top: 50%; width: 12px; height: 12px; margin-top: -6px; border-radius: 50%; background: var(--pc-red); }
.jr-rail__age { position: absolute; bottom: 0; left: calc(var(--w) + 18px); font: 800 clamp(48px, 5.6vw, 84px)/.8 var(--pc-display); font-stretch: 72%; letter-spacing: -.03em; }
.jr-rails__axis { position: relative; height: 24px; margin: 6px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--pc-line); font-size: 15px; color: var(--pc-dim); }
.jr-rails__axis li { position: absolute; top: 6px; left: calc(var(--a) / 11 * 88%); white-space: nowrap; }
.jr-quotes { margin-top: clamp(40px, 4vw, 64px); }

.kd-hero__quote { position: absolute; left: var(--pc-gutter); right: var(--pc-gutter); top: clamp(150px, 19vh, 190px); margin: 0; }
.kd-hero__quote p { max-width: 13.6em; margin: 0; font: 700 min(9.4vw, 15vh)/.92 var(--pc-display); font-stretch: 74%; letter-spacing: -.03em; text-indent: -.34em; color: var(--pc-ink); }
.kd-hero__pill { display: inline-block; width: 2.2em; height: .76em; vertical-align: -.02em; border-radius: 999px; overflow: hidden; }
.kd-hero__pill img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; filter: var(--pc-grade); }
.kd-belt { overflow: hidden; }
.kd-belt__band { position: relative; width: 90%; height: clamp(52px, 5.4vw, 80px); margin: clamp(24px, 3vw, 48px) 0 clamp(48px, 5vw, 80px); border-radius: 0 6px 6px 0; background: repeating-linear-gradient(180deg, rgba(16, 14, 13, .07) 0 2px, transparent 2px 8px), linear-gradient(180deg, #f4efe6, #ddd5c7); box-shadow: 0 30px 60px rgba(0, 0, 0, .5); transform-origin: left; }
.kd-belt__band::before { content: ""; position: absolute; inset: 12% 0; border-block: 1px dashed rgba(16, 14, 13, .22); }
.kd-belt__stripe { position: absolute; top: -3%; bottom: -3%; right: calc(4% + var(--n) * clamp(26px, 2.6vw, 40px)); width: clamp(12px, 1.2vw, 18px); border-radius: 2px; background: var(--pc-red); box-shadow: 0 6px 14px rgba(0, 0, 0, .35); transition: transform .7s var(--pc-ease), opacity .5s; }
.is-armed .kd-belt__stripe:not(.is-on) { opacity: 0; transform: translateY(-70%) scaleY(1.4); }

.tn-hero__wall img { object-position: 50% 40%; filter: var(--pc-grade) brightness(.46); }
.tn-hero__words { position: absolute; left: var(--pc-gutter); top: 46%; transform: translateY(-50%); --pc-giant-size: min(24vw, 40vh); color: var(--pc-on-dark); }
.tn-hero__words > span { display: inline-block; }
.tn-hero__who { display: block; margin-top: 8px; font-size: 15px; letter-spacing: .02em; }
.tn-path { position: relative; margin-top: clamp(24px, 3vw, 48px); }
.tn-path__years { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; align-items: end; font: 800 clamp(56px, 7vw, 108px)/.8 var(--pc-display); font-stretch: 72%; letter-spacing: -.03em; }
.tn-path__years li { transition: opacity .6s; }
.tn-path__start { font: 600 17px/1.3 var(--body); letter-spacing: .02em; color: var(--pc-dim); }
.tn-path__goal { color: var(--pc-red); }
.tn-path__years.is-armed li:not(.is-on) { opacity: .12; }
.tn-path__track { position: relative; height: 4px; margin: clamp(18px, 2vw, 28px) 0 14px; }
.tn-path__line { position: absolute; inset: 0; background: var(--pc-ink); transform-origin: left; }
.tn-path__window { position: absolute; top: -6px; bottom: -6px; left: 62.5%; right: 0; border-radius: 3px; background: var(--pc-red); transform-origin: left; }
.tn-path__note { margin: 0 0 0 62.5%; max-width: 22em; font-size: 17px; color: var(--pc-dim); }
.tn-late__photo { aspect-ratio: 1; max-width: 520px; }

.ak-hero__film { position: absolute; left: 50%; top: 47%; width: min(48vw, 84vh); aspect-ratio: 960 / 506; transform: translate(-42%, -56%); }
.ak-hero__film video { width: 100%; height: 100%; object-fit: cover; filter: var(--pc-grade) brightness(.84); }
.ak-hero__hard, .ak-hero__soft { position: absolute; z-index: 1; --pc-giant-size: min(15vw, 24vh); color: var(--pc-on-dark); }
.ak-hero__hard { left: var(--pc-gutter); top: clamp(128px, 17vh, 160px); }
.ak-hero__soft { right: var(--pc-gutter); top: calc(47% + min(48vw, 84vh) * .04); }
.ak-bow__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(40px, 7vw, 120px); align-items: end; }
.ak-bow__member { position: relative; display: grid; justify-items: center; margin: 0; padding-top: 18%; }
.ak-bow__panel { position: absolute; left: 0; right: 0; bottom: 56px; height: 62%; border-radius: 4px; background: var(--pc-paper-2); }
.ak-bow__member img { position: relative; width: min(78%, 400px); -webkit-mask-image: linear-gradient(180deg, #000 86%, transparent 100%); mask-image: linear-gradient(180deg, #000 86%, transparent 100%); }
.ak-bow__member figcaption { position: relative; justify-self: stretch; height: 56px; padding-top: 16px; font-size: 15px; letter-spacing: .02em; color: var(--pc-dim); }

.tc-hero { background: var(--pc-paper-2); }
.tc-hero__breath { position: absolute; left: 64%; top: 46%; width: min(56vh, 38vw); aspect-ratio: 1; transform: translate(-50%, -50%); }
.tc-hero__moon { position: absolute; inset: 0; border-radius: 50%; animation: tc-breathe 10s ease-in-out infinite; }
.tc-hero__moon img { object-position: 46% 50%; }
.tc-hero__ring { position: absolute; inset: -7%; border: 1px solid rgba(16, 14, 13, .3); border-radius: 50%; animation: tc-ring 10s ease-in-out infinite; }
@keyframes tc-breathe { 0%, 100% { transform: scale(.93); } 50% { transform: scale(1); } }
@keyframes tc-ring { 0%, 100% { transform: scale(.9); opacity: .15; } 50% { transform: scale(1.03); opacity: 1; } }
.tc-hero__word { position: absolute; z-index: 1; left: var(--pc-gutter); top: 46%; transform: translateY(-30%); --pc-giant-size: min(16vw, 27vh); color: var(--pc-ink); }
.tc-flow { position: relative; aspect-ratio: 21 / 9; margin-bottom: clamp(40px, 5vw, 72px); overflow: hidden; border-radius: 4px; background: var(--pc-ink-2); }
.tc-flow img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: var(--pc-grade); animation: tc-flow 40s ease-in-out infinite; }
.tc-flow img + img { opacity: 0; }
.tc-flow img:nth-child(2) { animation-delay: 10s; }
.tc-flow img:nth-child(3) { animation-delay: 20s; }
.tc-flow img:nth-child(4) { animation-delay: 30s; }
@keyframes tc-flow { 0% { opacity: 0; transform: scale(1.06); } 12.5%, 25% { opacity: 1; } 37.5% { opacity: 0; transform: scale(1); } 100% { opacity: 0; } }

.kk-hero__bag { position: absolute; top: 0; bottom: 0; left: 50%; width: min(36vw, 62vh); margin-left: calc(min(36vw, 62vh) / -2); border-radius: 0; }
.kk-hero__bag img { object-position: 40% 30%; filter: var(--pc-grade) brightness(.78); }
.kk-hero__bag::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(16, 14, 13, .5) 0%, rgba(16, 14, 13, 0) 26%, rgba(16, 14, 13, 0) 56%, var(--pc-ink) 96%); }
.kk-hero__knocked, .kk-hero__out { position: absolute; z-index: 1; --pc-giant-size: min(16vw, 26vh); color: var(--pc-on-dark); }
.kk-hero__knocked { left: var(--pc-gutter); top: clamp(140px, 19vh, 180px); }
.kk-hero__out { right: var(--pc-gutter); top: calc(clamp(140px, 19vh, 180px) + min(16vw, 26vh) * .84); }
.kk-hero__knocked > span, .kk-hero__out > span { display: inline-block; }
.kk-signs__reel { overflow: hidden; margin-top: clamp(32px, 4vw, 56px); }
.kk-signs__track { display: flex; gap: 14px; width: max-content; animation: kk-reel 80s linear infinite; }
.kk-signs__track img { width: clamp(200px, 20vw, 290px); aspect-ratio: 1; object-fit: cover; border-radius: 4px; filter: var(--pc-grade); }
.kk-signs__reel:hover .kk-signs__track { animation-play-state: paused; }
@keyframes kk-reel { to { transform: translateX(calc(-50% - 7px)); } }

.cp-hero__wall img { object-position: 50% 55%; filter: var(--pc-grade) brightness(.3); }
.cp-year { position: absolute; left: var(--pc-gutter); right: var(--pc-gutter); top: 44%; transform: translateY(-50%); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.cp-year li { position: relative; text-align: center; }
.cp-year b { display: block; font: 800 min(11.6vw, 24vh)/.82 var(--pc-display); font-stretch: 72%; letter-spacing: -.03em; color: rgba(242, 236, 226, .2); transition: color .9s var(--pc-ease); }
.cp-year .is-break b { color: var(--pc-on-dark); }
.cp-year em { position: absolute; top: calc(100% + 16px); left: 50%; transform: translateX(-50%); padding-top: 10px; border-top: 2px solid var(--pc-red); font: 600 15px/1.2 var(--body); font-style: normal; letter-spacing: .04em; white-space: nowrap; color: var(--pc-on-dark); transition: opacity .9s; }
.cp-year__end em { left: auto; right: 0; transform: none; }
.cp-year.is-armed [data-lit]:not(.is-on) b { color: rgba(242, 236, 226, .2); }
.cp-year.is-armed [data-lit]:not(.is-on) em { opacity: 0; }
.cp-band { aspect-ratio: 21 / 9; }

.bp-hero__band { position: absolute; inset: 0 0 auto; height: 58%; border-radius: 0; }
.bp-hero__band img { object-position: 50% 32%; filter: var(--pc-grade) brightness(.7); }
.bp-hero__band::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(16, 14, 13, .55) 0%, rgba(16, 14, 13, 0) 30%, rgba(16, 14, 13, 0) 60%, var(--pc-ink) 100%); }
.bp-hero__story { position: absolute; left: var(--pc-gutter); right: var(--pc-gutter); top: 58%; display: flex; align-items: center; gap: clamp(20px, 2.4vw, 36px); transform: translateY(-62%); --pc-giant-size: min(15vw, 25vh); }
.bp-hero__day { color: var(--pc-on-dark); }
.bp-hero__rule { flex: 1; height: 2px; background: var(--pc-dim-dark); transform-origin: left; }
.bp-hero__then { font: 600 clamp(19px, 1.6vw, 24px)/1 var(--pc-display); letter-spacing: .01em; color: var(--pc-on-dark); white-space: nowrap; }
.bp-decade { display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); margin: clamp(16px, 2vw, 32px) 0 clamp(48px, 5vw, 80px); padding: 0; list-style: none; border-top: 2px solid var(--pc-line); }
.bp-decade li { position: relative; padding-top: 26px; font: 700 clamp(28px, 3vw, 44px)/1 var(--pc-display); font-stretch: 76%; letter-spacing: -.02em; transition: opacity .5s; }
.bp-decade li::before { content: ""; position: absolute; left: 0; top: -9px; width: 16px; height: 16px; border-radius: 50%; background: var(--pc-ink); transition: transform .5s var(--pc-ease); }
.bp-decade__party, .bp-decade__end { font-size: clamp(17px, 1.4vw, 20px); font-family: var(--body); font-weight: 600; letter-spacing: .01em; }
.bp-decade__end { text-align: right; white-space: nowrap; }
.bp-decade__end::before { left: auto; right: 0; background: var(--pc-red); }
.bp-decade.is-armed li:not(.is-on) { opacity: .15; }
.bp-decade.is-armed li:not(.is-on)::before { transform: scale(.4); }

@media (max-width: 860px) {
  .pp-crumb { left: auto; right: var(--pc-gutter); }
  .pp-split { grid-template-columns: minmax(0, 1fr); }
  .pp-more__links { grid-template-columns: minmax(0, 1fr); }
  .pp-more__link { flex-direction: row; align-items: baseline; justify-content: space-between; gap: 16px; padding: 14px 0; }
  .pp-more__meta { order: 2; }
  .pp-more__name { font-size: 28px; }
  .jr-hero__ages { top: 34%; --pc-giant-size: 70vw; }
  .jr-rail__line { width: calc(var(--w) * .8); }
  .jr-rail__age { left: calc(var(--w) * .8 + 12px); font-size: 44px; }
  .jr-rail__who span { display: block; margin: 2px 0 0; }
  .jr-rails__axis li { left: calc(var(--a) / 11 * 70.4%); }
  .jr-rails__axis li:nth-child(even) { display: none; }
  .kd-hero__quote { top: 24%; }
  .kd-hero__quote p { font-size: 13.4vw; text-indent: 0; }
  .kd-belt__band { width: 96%; }
  .tn-hero__words { top: 38%; --pc-giant-size: 31vw; white-space: normal; }
  .tn-hero__words > span > span { display: block; }
  .tn-path { padding-top: 40px; }
  .tn-path__years { grid-template-columns: repeat(7, minmax(0, 1fr)); font-size: 15vw; }
  .tn-path__start { position: absolute; top: 0; left: 0; }
  .tn-path__window { left: 57.14%; }
  .tn-path__note { margin-left: 0; }
  .ak-hero__film { top: 37%; width: 84vw; transform: translate(-50%, -50%); }
  .ak-hero__hard, .ak-hero__soft { --pc-giant-size: 25vw; }
  .ak-hero__hard { top: 150px; }
  .ak-hero__soft { top: calc(37% + 21vw); }
  .ak-bow__grid { grid-template-columns: minmax(0, 1fr); }
  .ak-bow__member { width: 86%; justify-self: center; }
  .tc-hero__breath { left: 50%; top: 36%; width: 76vw; }
  .tc-hero__word { top: 50%; transform: none; --pc-giant-size: 27vw; }
  .tc-flow { aspect-ratio: 4 / 3; }
  .kk-hero__bag { width: 64vw; margin-left: -32vw; bottom: 30%; }
  .kk-hero__knocked, .kk-hero__out { --pc-giant-size: 27vw; }
  .kk-hero__knocked { top: 170px; }
  .kk-hero__out { top: calc(170px + 23vw); }
  .kk-signs__track img { width: 190px; }
  .cp-year { top: 36%; grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: 52px; }
  .cp-year b { font-size: 21vw; }
  .cp-band { aspect-ratio: 4 / 3; }
  .bp-hero__band { height: 54%; }
  .bp-hero__story { top: 54%; flex-wrap: wrap; row-gap: 10px; --pc-giant-size: 25vw; }
  .bp-hero__rule { flex: 1 1 40%; }
  .bp-decade { grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: 40px; border-top: 0; }
  .bp-decade li { border-top: 2px solid var(--pc-line); }
  .bp-decade__party, .bp-decade__end { grid-column: span 2; }
  .bp-decade__end { text-align: left; }
  .bp-decade__end::before { left: 0; right: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .jr-hero__photo, .tc-hero__moon, .tc-hero__ring, .kk-signs__track { animation: none; }
}
