/* ================= llmstxt-gen: its own hero =================
   This page as an llms.txt file, on the logo's night-blue sheet. Markdown marks hang in a margin of their own. */
.lgh {
  --lgh-night: #0b1120; --lgh-line: #eef0fb; --lgh-mint: #43e0bc; --lgh-mark: #8fe9d2;
  --lgh-g: clamp(36px, 6.4vw, 112px); /* the margin the marks hang in */
  padding: clamp(32px, 6vh, 72px) var(--m) 0;
}
.lgh-sheet {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 17rem); gap: clamp(32px, 5vw, 80px); align-items: end;
  padding: clamp(36px, 6vw, 96px) clamp(16px, 5vw, 88px) clamp(36px, 5vw, 80px) clamp(8px, 2vw, 32px);
  background: var(--lgh-night); color: var(--lgh-line); border-radius: 28px;
}
.lgh-doc { min-width: 0; }
.lgh-l { display: grid; grid-template-columns: var(--lgh-g) minmax(0, 1fr); align-items: baseline; }
.lgh-l > :not(.lgh-m) { grid-column: 2; }
.lgh-m {
  grid-column: 1; justify-self: end; padding-right: clamp(10px, 1.4vw, 22px);
  font-family: var(--f-code); /* taste-skill-ignore: the file's own Markdown marks */
  color: var(--lgh-mark); line-height: 1;
}

.lgh-h1 h1 { font-size: clamp(40px, 11vw, 176px); line-height: .9; letter-spacing: -0.045em; color: var(--lgh-line); white-space: nowrap; }
.lgh-h1 .lgh-m { font-size: clamp(22px, 5vw, 80px); }
.lgh-bq { margin-top: clamp(18px, 2vw, 28px); }
.lgh-title { margin: 0; font: 400 italic clamp(1.5rem, 1.1rem + 1.5vw, 2.5rem)/1.1 var(--fd); color: var(--lgh-line); }
.lgh-bq .lgh-m { font-size: clamp(1.25rem, 1rem + 1vw, 2rem); }
.lgh-p { margin-top: 24px; }
.lgh-intro { margin: 0; max-width: 40em; font-size: var(--step-lead); line-height: 1.5; color: var(--lgh-line); }

.lgh-h2 { margin-top: clamp(32px, 3.4vw, 48px); }
.lgh-h2 p { margin: 0; font: 700 clamp(1.125rem, 1rem + .4vw, 1.375rem)/1.2 var(--f); color: var(--lgh-line); }
.lgh-h2 .lgh-m { font-size: 1.125rem; }

.lgh-list { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 12px; }
.lgh-list .lgh-m { font-size: 1.125rem; }
.lgh-li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; font-size: var(--step-body); line-height: 1.45; }
.lgh-desc { color: var(--lgh-line); }
.lgh-li .btn { background: var(--lgh-mint); color: var(--lgh-night); }
.lgh-li .btn::before { background: var(--lgh-line); }
.lgh-li .text-link { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; color: var(--lgh-mint); }
.lgh-li .text-link::after { bottom: 9px; }
.lgh-list:not(.lgh-facts) .lgh-l { align-items: center; }

.lgh-facts { grid-template-columns: repeat(2, minmax(0, max-content)); gap: 8px clamp(24px, 4vw, 64px); }
.lgh-facts .lgh-li { gap: 8px; flex-wrap: nowrap; }
.lgh-facts b { font: 700 var(--step-body)/1.45 var(--f); color: var(--lgh-mint); }

.lgh-file { margin: 0; display: grid; gap: 18px; font-size: var(--step-body); line-height: 1.5; color: var(--lgh-line); }
.lgh-file img { width: clamp(64px, 6vw, 96px); height: auto; border-radius: 26%; }

/* the file is written line by line, the way the tool composes it */
@media (prefers-reduced-motion: no-preference) {
  .lgh-doc > *, .lgh-list > li { animation: lgh-write 600ms var(--ease-out) both; }
  .lgh-doc > :nth-child(2) { animation-delay: 80ms; }
  .lgh-doc > :nth-child(3) { animation-delay: 160ms; }
  .lgh-doc > :nth-child(n+4) { animation-delay: 240ms; }
  @keyframes lgh-write { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
}

@media (max-width: 1024px) {
  .lgh-sheet { grid-template-columns: 1fr; align-items: start; }
  .lgh-file { grid-template-columns: auto minmax(0, 1fr); align-items: center; padding-left: var(--lgh-g); }
}
@media (max-width: 760px) {
  .lgh-sheet { border-radius: 22px; padding-right: 16px; }
  .lgh-facts { grid-template-columns: 1fr; }
  .lgh-li .btn { width: 100%; }
  .lgh-file { grid-template-columns: 1fr; }
}
