/* Biz kimiz — chapter styles. Shared rules live in ../shared/site.css */
/* 1 · Hero */
.hero-type {
  font-size: var(--t-display);
  line-height: .95;
  letter-spacing: -.02em;
  font-variation-settings: "wght" 820, "wdth" 100;
}
.hero-type .c { --w: 820; }
.hl-line { display: block; width: fit-content; margin-inline: auto; white-space: nowrap; padding-bottom: .04em; }
.hero-sub {
  margin-top: clamp(20px, 4svh, 44px);
  max-width: 34ch; font-size: var(--t-lead); line-height: 1.45;
  font-variation-settings: "wght" 440, "wdth" 100;
  color: color-mix(in srgb, var(--paper) 86%, var(--cobalt));
  text-wrap: balance;
}
.cue {
  position: absolute; left: 50%; bottom: 28px; translate: -50% 0;
  display: grid; justify-items: center; gap: 10px;
  font-size: .8rem; font-variation-settings: "wght" 600, "wdth" 120;
  color: color-mix(in srgb, var(--paper) 86%, var(--cobalt));
}
.cue i { width: 36px; height: 2px; background: currentColor; transform-origin: left; animation: cue 2.4s var(--ease) infinite; }
@keyframes cue { 0% { transform: scaleX(0); } 50% { transform: scaleX(1); transform-origin: left; } 51% { transform-origin: right; } 100% { transform: scaleX(0); transform-origin: right; } }

/* 2 · Journey */
.journey { --peak: 125; display: block; place-items: normal; min-height: 0; padding: 0; }
.jtrack { position: relative; }
.jp {
  display: grid; justify-items: center; align-content: center; grid-template-columns: minmax(0, 1fr);
  gap: clamp(12px, 2.4svh, 26px); text-align: center;
}
.jw {
  font-size: var(--t-display); line-height: .95; letter-spacing: -.02em;
  font-variation-settings: "wght" 860, "wdth" var(--peak);
}
.jw .c { --w: 860; --s: var(--peak); }
.jl { display: block; width: fit-content; margin-inline: auto; white-space: nowrap; padding-bottom: .04em; }
.js {
  max-width: 30ch; font-size: var(--t-lead); line-height: 1.45;
  font-variation-settings: "wght" 460, "wdth" 100; text-wrap: balance;
}
.js-list { max-width: 34ch; font-variation-settings: "wght" 640, "wdth" 104; }
.js-by { font-size: clamp(.95rem, .9rem + .2vw, 1.1rem); font-variation-settings: "wght" 620, "wdth" 112; }

.motion .jtrack { display: flex; width: max-content; height: 100svh; text-align: left; }
.motion .jw .c { translate: 0 calc(var(--ty, 0) * 1%); }
.motion .jg { flex: none; display: flex; align-items: center; height: 100svh; gap: clamp(48px, 9vw, 160px); padding-inline: clamp(16px, 7vw, 120px); }
.motion .jg[data-theme="red"] { gap: clamp(40px, 6vw, 110px); }
.motion .jp { flex: none; width: min(36rem, 86vw); }
.still .jg { display: grid; gap: clamp(56px, 10svh, 104px); padding: clamp(64px, 12svh, 128px) var(--gut); }

/* 3 · Olympos Web */
.quiet { gap: clamp(24px, 5svh, 56px); align-content: center; }
.q-h {
  color: var(--cobalt);
  font-size: var(--t-h2); line-height: 1; letter-spacing: -.03em;
  font-variation-settings: "wght" 820, "wdth" 115; white-space: nowrap;
}
.q-h .c { --w: 820; --s: 115; }
.q-list { list-style: none; padding: 0; display: grid; gap: clamp(6px, 1.4svh, 14px); }
.q-list li {
  font-size: var(--t-text); line-height: 1.35; letter-spacing: -.01em;
  font-variation-settings: "wght" 480, "wdth" 96; text-wrap: balance;
}

/* 4 · Close */
.close { align-content: center; gap: clamp(28px, 5svh, 56px); }
.close-h {
  font-size: var(--t-display); line-height: .95; letter-spacing: -.03em;
  font-variation-settings: "wght" 840, "wdth" 110; white-space: nowrap;
}
.close-h .c { --w: 840; --s: 110; }

.still .cue i { animation: none; }
@media (max-width: 640px) {
  .cue { display: none; }
  .journey { --peak: 78; }
}
@media (prefers-contrast: more) { .hero-sub, .cue { color: inherit; } }