/* Solidlab deck — dark, typographic, 1920x1080
   Default: Sort base, Antikkhvit text, Oslo accents.
*/
@import url('../colors_and_type.css');

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { background: #000; }

deck-stage > section {
  background: var(--sort);
  color: var(--antikkhvit);
  font-family: var(--font-sans);
  padding: 96px 120px;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}

.slash {
  font-family: var(--font-mono);
  font-size: 22px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mist);
  font-weight: 500;
}
.slash.accent { color: var(--oslo); }

.corner-top {
  position: absolute; top: 60px; left: 120px; right: 120px;
  display: flex; justify-content: space-between; align-items: center;
}
.corner-bot {
  position: absolute; bottom: 60px; left: 120px; right: 120px;
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--font-mono); font-size: 18px;
  color: var(--mist); letter-spacing: 0.06em; text-transform: uppercase;
}
.wm {
  font-family: var(--font-sans); font-weight: 700;
  font-size: 28px; letter-spacing: -0.02em; color: var(--antikkhvit);
}

/* Title slide */
.s-title__wm { font-size: 160px; font-weight: 700; letter-spacing: -0.04em; line-height: 0.9; margin-top: auto; margin-bottom: 40px; }
.s-title__tag { font-size: 36px; font-weight: 400; letter-spacing: -0.01em; color: var(--alvesolv); max-width: 1200px; line-height: 1.25; text-wrap: balance; }
.s-title__tag em { font-style: normal; color: var(--oslo); }
.s-title__meta { display: flex; gap: 64px; margin-top: auto; font-family: var(--font-mono); font-size: 20px; color: var(--mist); letter-spacing: 0.06em; text-transform: uppercase; }

/* Section divider slide (Oslo) */
.s-section { background: var(--oslo) !important; color: var(--antikkhvit); }
.s-section .slash, .s-section .corner-bot { color: rgba(244,241,234,0.7); }
.s-section__num { font-size: 300px; font-weight: 700; letter-spacing: -0.05em; line-height: 0.8; color: var(--antikkhvit); margin-top: auto; }
.s-section__title { font-size: 96px; font-weight: 700; letter-spacing: -0.03em; line-height: 1.05; color: var(--antikkhvit); margin-top: 16px; max-width: 1500px; text-wrap: balance; }

/* Content slide */
.s-content__head { margin-top: 80px; }
.s-content__eyebrow { margin-bottom: 32px; }
.s-content__title { font-size: 88px; font-weight: 700; letter-spacing: -0.03em; line-height: 1.05; max-width: 1500px; text-wrap: balance; }
.s-content__body { font-size: 32px; line-height: 1.55; color: var(--alvesolv); margin-top: 48px; max-width: 1200px; text-wrap: pretty; }
.s-content__body strong { color: var(--antikkhvit); font-weight: 500; }

/* Big quote */
.s-quote { justify-content: center; }
.s-quote__mark { font-family: var(--font-mono); font-size: 240px; color: var(--oslo); line-height: 0.8; font-weight: 500; margin-bottom: 16px; }
.s-quote__text { font-size: 80px; font-weight: 500; letter-spacing: -0.02em; line-height: 1.15; max-width: 1600px; text-wrap: balance; }
.s-quote__text em { font-style: normal; color: var(--oslo); }
.s-quote__cite { font-family: var(--font-mono); font-size: 22px; color: var(--mist); letter-spacing: 0.08em; text-transform: uppercase; margin-top: 48px; }

/* Comparison */
.s-compare__head { margin-top: 80px; margin-bottom: 72px; }
.s-compare__title { font-size: 64px; font-weight: 700; letter-spacing: -0.02em; text-wrap: balance; max-width: 1500px; line-height: 1.1; }
.s-compare__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--border-dark); border: 1px solid var(--border-dark); flex: 1; }
.s-compare__col { background: var(--sort); padding: 56px; display: flex; flex-direction: column; gap: 24px; }
.s-compare__col--good { border-left: 3px solid var(--oslo); }
.s-compare__tag { font-family: var(--font-mono); font-size: 22px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--mist); }
.s-compare__col--good .s-compare__tag { color: var(--oslo); }
.s-compare__t { font-size: 40px; font-weight: 600; line-height: 1.2; color: var(--antikkhvit); letter-spacing: -0.01em; }
.s-compare__b { font-size: 24px; line-height: 1.55; color: var(--alvesolv); }

/* Three-column content */
.s-three__head { margin-top: 80px; margin-bottom: 72px; }
.s-three__title { font-size: 72px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.1; max-width: 1400px; text-wrap: balance; }
.s-three__grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 2px; background: var(--border-dark); border: 1px solid var(--border-dark); flex: 1; }
.s-three__col { background: var(--sort); padding: 48px; display: flex; flex-direction: column; gap: 20px; }
.s-three__n { font-family: var(--font-mono); font-size: 22px; color: var(--oslo); letter-spacing: 0.08em; text-transform: uppercase; }
.s-three__t { font-size: 36px; font-weight: 600; line-height: 1.2; color: var(--antikkhvit); letter-spacing: -0.01em; }
.s-three__b { font-size: 22px; line-height: 1.6; color: var(--alvesolv); }

/* Closing */
.s-close { justify-content: center; align-items: flex-start; }
.s-close__wm { font-size: 200px; font-weight: 700; letter-spacing: -0.04em; line-height: 0.9; }
.s-close__tag { font-size: 40px; line-height: 1.3; color: var(--alvesolv); margin-top: 32px; max-width: 1300px; }
.s-close__contact { margin-top: 120px; display: flex; gap: 80px; font-family: var(--font-mono); font-size: 24px; color: var(--mist); letter-spacing: 0.04em; }
.s-close__contact span { color: var(--antikkhvit); }

/* ===== 06 · Big metric ===== */
.s-metric { justify-content: center; }
.s-metric__grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 120px; align-items: center; }
.s-metric__title { font-size: 72px; font-weight: 700; letter-spacing: -0.025em; line-height: 1.05; color: var(--antikkhvit); text-wrap: balance; }
.s-metric__body  { font-size: 24px; line-height: 1.55; color: var(--alvesolv); margin-top: 32px; max-width: 520px; text-wrap: pretty; }
.s-metric__fig   { padding-left: 48px; border-left: 3px solid var(--oslo); display: flex; flex-direction: column; gap: 24px; }
.s-metric__num   { font-size: 360px; font-weight: 700; letter-spacing: -0.04em; line-height: 0.85; color: var(--antikkhvit); display: flex; align-items: flex-end; gap: 16px; }
.s-metric__num span { font-size: 64px; font-weight: 500; color: var(--oslo); letter-spacing: -0.01em; margin-bottom: 32px; font-family: var(--font-mono); }
.s-metric__lbl   { font-family: var(--font-mono); font-size: 18px; color: var(--mist); letter-spacing: 0.08em; text-transform: uppercase; }
.s-metric__sub   { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 24px; padding-top: 24px; border-top: 1px solid #1F1F1F; }
.s-metric__sub div { display: flex; flex-direction: column; gap: 6px; }
.s-metric__sub strong { font-size: 56px; font-weight: 700; color: var(--antikkhvit); letter-spacing: -0.02em; line-height: 1; }
.s-metric__sub span { font-family: var(--font-mono); font-size: 13px; color: var(--mist); letter-spacing: 0.06em; text-transform: uppercase; }

/* ===== 07 · Timeline ===== */
.s-timeline { position: relative; margin-top: 72px; display: flex; flex-direction: column; gap: 32px; padding-left: 48px; }
.s-timeline__axis {
  position: absolute; left: 12px; top: 14px; bottom: 14px; width: 1px;
  background: linear-gradient(to bottom, var(--oslo) 0%, var(--oslo) 75%, rgba(74,90,98,0.3) 100%);
}
.s-timeline__row { display: grid; grid-template-columns: 180px 1fr 2fr; gap: 40px; align-items: baseline; position: relative; padding: 8px 0; }
.s-timeline__pt  { position: absolute; left: -48px; top: 18px; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; }
.s-timeline__pt span { display: block; width: 12px; height: 12px; background: var(--oslo); border: 3px solid var(--sort); outline: 1px solid var(--oslo); }
.s-timeline__row--now .s-timeline__pt span { background: var(--antikkhvit); outline-color: var(--antikkhvit); width: 16px; height: 16px; }
.s-timeline__row--future .s-timeline__pt span { background: transparent; outline-color: rgba(74,90,98,0.6); }
.s-timeline__yr { font-family: var(--font-mono); font-size: 32px; font-weight: 500; color: var(--oslo); letter-spacing: 0.02em; }
.s-timeline__row--now .s-timeline__yr { color: var(--antikkhvit); }
.s-timeline__row--future .s-timeline__yr { color: var(--fog); }
.s-timeline__t  { font-size: 34px; font-weight: 600; color: var(--antikkhvit); letter-spacing: -0.01em; line-height: 1.2; }
.s-timeline__row--future .s-timeline__t { color: var(--alvesolv); }
.s-timeline__b  { font-size: 20px; line-height: 1.5; color: var(--alvesolv); text-wrap: pretty; }

/* ===== 08 · Image-led ===== */
.s-image { padding: 0; flex-direction: row; }
.s-image__media { flex: 1.1; position: relative; overflow: hidden; }
.s-image__ph {
  position: absolute; inset: 0; background: #0F0F0F;
  display: flex; align-items: center; justify-content: center;
  background-image:
    repeating-linear-gradient(0deg, transparent 0 95px, rgba(74,90,98,0.14) 95px 96px),
    repeating-linear-gradient(90deg, transparent 0 95px, rgba(74,90,98,0.14) 95px 96px);
}
.s-image__ph .slash { color: var(--fog); font-size: 20px; }
.s-image__panel {
  flex: 1; padding: 96px 120px; background: var(--sort);
  display: flex; flex-direction: column; justify-content: center;
  border-left: 1px solid #1F1F1F;
}
.s-image__title { font-size: 84px; font-weight: 700; letter-spacing: -0.03em; line-height: 1.0; color: var(--antikkhvit); text-wrap: balance; }
.s-image__body  { font-size: 26px; line-height: 1.5; color: var(--alvesolv); margin-top: 40px; text-wrap: pretty; max-width: 620px; }
