/* Corps des articles ({{content}}) + cartes Koenig */

.gh-content {
  --col: 680px;
  display: grid;
  grid-template-columns:
    [full-start] minmax(20px, 1fr)
    [wide-start] minmax(0, 150px)
    [main-start] minmax(0, var(--col)) [main-end]
    minmax(0, 150px) [wide-end]
    minmax(20px, 1fr) [full-end];
  padding: 44px 0 56px;
  font-size: 17px; line-height: 1.72; color: var(--black);
  text-wrap: pretty;
}
.gh-content > * { grid-column: main; }
.gh-content > * + * { margin-top: 1.3em; }
.gh-content > .kg-width-wide { grid-column: wide; }
.gh-content > .kg-width-full { grid-column: full; }
.gh-content > .kg-width-full img { border-left: none; border-right: none; border-radius: 0; }

.gh-content a { text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.gh-content strong { font-weight: 700; }

.gh-content h2 { font-family: 'Bebas Neue', sans-serif; font-weight: 400; font-size: clamp(34px, 4vw, 46px); line-height: 0.95; letter-spacing: 0.035em; text-transform: uppercase; margin-top: 1.6em; }
.gh-content h2 strong, .gh-content h3 strong { font-weight: inherit; }
.gh-content h3 { font-size: 22px; line-height: 1.3; font-weight: 700; margin-top: 1.8em; }
.gh-content h4, .gh-content h5, .gh-content h6 { font-family: 'Space Mono', monospace; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--orange); margin-top: 2em; }
.gh-content h2 + *, .gh-content h3 + *, .gh-content h4 + * { margin-top: 0.7em; }

.gh-content ul, .gh-content ol { padding-left: 1.4em; }
.gh-content li + li { margin-top: 0.45em; }
.gh-content ul li::marker { content: '■  '; color: var(--orange); font-size: 0.6em; }
.gh-content ol li::marker { font-family: 'Space Mono', monospace; font-size: 0.8em; color: var(--orange); }

.gh-content hr {
  position: relative; border: none; height: 1px; background: var(--border); margin: 2.6em 0;
  overflow: visible;
}
.gh-content hr::after {
  content: ''; position: absolute; left: 50%; top: -4px; transform: translateX(-50%);
  width: 9px; height: 9px; background: var(--orange);
}

.gh-content blockquote:not([class]) {
  border-left: 3px solid var(--orange); padding: 2px 0 2px 22px;
  font-size: 18px; font-weight: 500;
}
.gh-content blockquote.kg-blockquote-alt, .gh-content .pullquote {
  position: relative; padding: 26px 28px;
  background: var(--code-bg); border: 1px solid var(--code-border); border-radius: 4px;
  font-size: 18.5px; line-height: 1.65; font-weight: 500; font-style: normal; text-align: left;
}
.gh-content blockquote.kg-blockquote-alt::before, .gh-content .pullquote::before {
  content: ''; position: absolute; top: -5px; left: 50%; transform: translateX(-50%);
  width: 9px; height: 9px; background: var(--orange);
}
.gh-content blockquote p + p { margin-top: 0.8em; }

.gh-content code { font-family: 'Space Mono', monospace; font-size: 0.82em; background: var(--code-bg); border: 1px solid var(--code-border); border-radius: 3px; padding: 1px 5px; }
.gh-content pre { background: var(--code-bg); border: 1px solid var(--code-border); border-radius: 4px; padding: 16px 18px; overflow-x: auto; font-size: 13px; line-height: 1.7; }
.gh-content pre code { background: none; border: none; padding: 0; font-size: inherit; }

.gh-content figure img, .gh-content > p img { display: block; max-width: 100%; height: auto; margin: 0 auto; border: 1px solid var(--border); border-radius: 3px; }
.gh-content figcaption { margin-top: 10px; text-align: center; font-family: 'Space Mono', monospace; font-size: 11px; line-height: 1.6; color: var(--muted); }
.gh-content .kg-gallery-image img { border-radius: 0; }

.gh-content iframe { display: block; max-width: 100%; border: 0; margin: 0 auto; }
.gh-content .kg-embed-card { display: flex; flex-direction: column; align-items: center; }

.gh-content table { width: 100%; border-collapse: collapse; font-size: 14px; display: block; overflow-x: auto; }
.gh-content th, .gh-content td { border: 1px solid var(--border); padding: 8px 12px; text-align: left; }
.gh-content th { font-family: 'Space Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; background: var(--code-bg); }

/* cartes Koenig : on recolore, la mise en page vient de card_assets */
.gh-content .kg-bookmark-card a.kg-bookmark-container { text-decoration: none; color: var(--black); background: var(--surface); border: 1px solid var(--border); border-radius: 4px; box-shadow: 3px 3px 0 var(--border); }
.gh-content .kg-bookmark-card a.kg-bookmark-container:hover { border-color: var(--orange); box-shadow: 3px 3px 0 var(--orange); }
.gh-content .kg-bookmark-title { font-weight: 700; }
.gh-content .kg-bookmark-description, .gh-content .kg-bookmark-metadata { color: var(--muted); }
.gh-content .kg-bookmark-thumbnail img { border: none; border-radius: 0; }

.gh-content .kg-callout-card { border-radius: 4px; border: 1px solid var(--border); }
.gh-content .kg-callout-card-grey, .gh-content .kg-callout-card-white { background: var(--code-bg); }
.gh-content .kg-callout-card-accent { background: var(--orange); color: #fff; }
.gh-content .kg-callout-card-accent a { color: #fff; text-decoration-color: #fff; }

.gh-content .kg-toggle-card { background: var(--surface); border: 1px solid var(--border); border-radius: 4px; box-shadow: none; }
.gh-content .kg-toggle-heading-text { font-family: 'Space Grotesk', sans-serif; }

.gh-content .kg-btn { font-family: 'Space Mono', monospace; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; border-radius: 3px; text-decoration: none; }
.gh-content .kg-btn-accent { background: var(--orange); color: #fff; }

.gh-content .kg-file-card-container, .gh-content .kg-audio-card, .gh-content .kg-product-card-container {
  background: var(--code-bg); border: 1px solid var(--border); border-radius: 4px; box-shadow: none; color: var(--black);
}
.gh-content .kg-file-card a { text-decoration: none; }

.gh-content .kg-header-card, .gh-content .kg-signup-card { border-radius: 4px; }

@media (max-width: 640px) {
  .gh-content { font-size: 16px; padding: 30px 0 40px; }
}
