/* LP WEB EXPRESSION LAYER - hand-authored (BRAND.md "Web expression").
 * Additive on top of generated brand.css. Web surfaces only - never print.
 * Ship next to brand.css; the @font-face expects fonts/lp-serif-italic.woff2
 * relative to this file's deployed location.
 */

/* 'LP Serif' is Instrument Serif italic 400 (picked 2026-07-07), self-hosted. */
@font-face {
  font-family: 'LP Serif';
  src: url('fonts/lp-serif-italic.woff2') format('woff2');
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

/* ONE italic serif word/phrase inside an Inter 900 headline. Nothing else. */
.lp-serif-accent {
  font-family: 'LP Serif', Georgia, 'Times New Roman', serif;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
}

/* Ink section surface: where the machines hum. */
.lp-surface-ink { background: var(--lp-ink); color: var(--lp-paper-warm); }
.lp-surface-ink .lp-eyebrow { color: var(--lp-champagne); }
.lp-data-bright { color: var(--lp-spark-bright); }

/* Flat spark_bright dot field. Dark sections only, masked, never over text. */
.lp-dither {
  position: absolute;
  inset: 0 0 0 auto;
  width: 220px;
  pointer-events: none;
  background-image: radial-gradient(circle, rgba(139, 119, 255, 0.5) 1px, transparent 1px);
  background-size: 7px 7px;
  -webkit-mask-image: linear-gradient(100deg, transparent 10%, rgba(0, 0, 0, 0.9) 65%);
          mask-image: linear-gradient(100deg, transparent 10%, rgba(0, 0, 0, 0.9) 65%);
}

/* Living cairn: hero-scale ghost mark. With the ticker, one of the two
 * sanctioned motions on LP web surfaces. Light surfaces only; the cap rect
 * must NOT carry an SVG transform attribute (CSS owns the rotation). */
.lp-living-cairn { position: absolute; pointer-events: none; }
.lp-living-cairn .lp-cairn-cap {
  transform-origin: 120px 121.5px;
  transform-box: view-box;
  animation: lp-cairn-rock 12s ease-in-out infinite;
}
@keyframes lp-cairn-rock {
  0%, 12%   { transform: rotate(0deg); }
  42%, 70%  { transform: rotate(-8deg); }
  100%      { transform: rotate(0deg); }
}
@media (prefers-reduced-motion: reduce) {
  .lp-living-cairn .lp-cairn-cap { animation: none; transform: rotate(-8deg); }
}

/* Proof-of-life ticker: with the living cairn, one of the two sanctioned motions. */
.lp-ticker { position: relative; overflow: hidden; }
.lp-ticker-track {
  display: flex;
  width: max-content;
  gap: 56px;
  padding-right: 56px;
  animation: lp-crawl 70s linear infinite;
}
.lp-ticker:hover .lp-ticker-track { animation-play-state: paused; }
.lp-ticker-item {
  font-family: 'SF Mono', 'Menlo', 'Consolas', monospace;
  font-size: 14px;
  letter-spacing: 0.06em;
  white-space: nowrap;
  color: var(--lp-gray-mid);
}
.lp-ticker-item strong {
  color: var(--lp-spark-bright);
  font-weight: 700;
  font-size: 18px;
  margin-right: 6px;
}
@keyframes lp-crawl {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .lp-ticker-track { animation: none; flex-wrap: wrap; width: auto; row-gap: 12px; }
  .lp-ticker-item[aria-hidden="true"] { display: none; }
}