/* =============================================
   AGR — Ghost Koenig Card Styles (cards.css)
   Required by Ghost theme validator
   ============================================= */

/* --- Card base --- */
.kg-card { margin: 2rem 0; }
.kg-card figcaption {
  font-size: 12px;
  color: #888780;
  text-align: center;
  margin-top: 8px;
  font-style: italic;
}

/* --- Width utilities (REQUIRED by Ghost) --- */
.kg-width-wide {
  position: relative;
  width: 85vw;
  min-width: 100%;
  margin: 2rem calc(50% - 42.5vw);
}
.kg-width-full {
  position: relative;
  width: 100vw;
  margin: 2rem calc(50% - 50vw);
}

/* --- Image card --- */
.kg-image-card img {
  width: 100%;
  height: auto;
  display: block;
}

/* --- Gallery card --- */
.kg-gallery-card { margin: 2rem 0; }
.kg-gallery-container {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.kg-gallery-row {
  display: flex;
  gap: 4px;
  width: 100%;
}
.kg-gallery-image {
  flex: 1;
  min-width: 0;
}
.kg-gallery-image img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}

/* --- Embed / video card --- */
.kg-embed-card { margin: 2rem 0; }
.kg-embed-card iframe,
.kg-embed-card video {
  width: 100%;
  aspect-ratio: 16 / 9;
  display: block;
  border: none;
}

/* --- Bookmark card --- */
.kg-bookmark-card { margin: 2rem 0; }
.kg-bookmark-container {
  display: flex;
  border: 1px solid #E6F1FB;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s;
}
.kg-bookmark-container:hover { border-color: #185FA5; }
.kg-bookmark-content {
  flex: 1;
  padding: 1.25rem;
  min-width: 0;
}
.kg-bookmark-title {
  font-family: 'Libre Baskerville', serif;
  font-size: 15px;
  font-weight: 700;
  color: #071C38;
  margin-bottom: 6px;
  line-height: 1.3;
}
.kg-bookmark-description {
  font-size: 13px;
  color: #5F5E5A;
  line-height: 1.5;
  margin-bottom: 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.kg-bookmark-metadata {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #888780;
}
.kg-bookmark-icon { width: 16px; height: 16px; }
.kg-bookmark-thumbnail {
  width: 160px;
  flex-shrink: 0;
}
.kg-bookmark-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* --- Callout card --- */
.kg-callout-card {
  display: flex;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  border-left: 3px solid #185FA5;
  background: #E6F1FB;
  margin: 2rem 0;
}
.kg-callout-emoji { font-size: 20px; flex-shrink: 0; }
.kg-callout-text { font-size: 15px; color: #071C38; line-height: 1.6; }

/* --- Toggle card --- */
.kg-toggle-card { margin: 2rem 0; border: 1px solid #E6F1FB; }
.kg-toggle-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.25rem;
  cursor: pointer;
  font-family: 'Libre Baskerville', serif;
  font-weight: 700;
  font-size: 16px;
  color: #071C38;
}
.kg-toggle-content {
  padding: 0 1.25rem 1rem;
  font-size: 14px;
  color: #5F5E5A;
  line-height: 1.7;
}

/* --- Button card --- */
.kg-button-card {
  display: flex;
  justify-content: center;
  margin: 2rem 0;
}
.kg-btn {
  display: inline-block;
  background: #185FA5;
  color: #ffffff;
  font-size: 13px;
  letter-spacing: 0.08em;
  padding: 12px 28px;
  font-weight: 500;
  font-family: 'DM Sans', sans-serif;
  transition: background 0.15s;
}
.kg-btn:hover { background: #1a6bbf; }

/* --- Divider card --- */
.kg-divider {
  border: none;
  border-top: 1px solid #E6F1FB;
  margin: 2.5rem 0;
}

/* --- Code card --- */
.kg-code-card { margin: 2rem 0; }
.kg-code-card pre {
  background: #071C38;
  color: #E6F1FB;
  padding: 1.5rem;
  overflow-x: auto;
  font-size: 13px;
  line-height: 1.6;
  font-family: 'Courier New', monospace;
}

/* --- Header card --- */
.kg-header-card {
  background: #071C38;
  padding: 4rem 2rem;
  text-align: center;
  margin: 2rem 0;
}
.kg-header-card h2 {
  font-family: 'Libre Baskerville', serif;
  font-size: 32px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}
.kg-header-card p {
  font-size: 16px;
  color: #7AADDA;
  line-height: 1.6;
}

/* --- Product card --- */
.kg-product-card { margin: 2rem 0; border: 1px solid #E6F1FB; padding: 1.5rem; }
.kg-product-card-image { width: 100%; margin-bottom: 1rem; }
.kg-product-card-title { font-family: 'Libre Baskerville', serif; font-size: 20px; font-weight: 700; color: #071C38; margin-bottom: 8px; }
.kg-product-card-description { font-size: 14px; color: #5F5E5A; line-height: 1.6; margin-bottom: 1rem; }
.kg-product-card-rating-star { color: #185FA5; }

/* --- Responsive cards --- */
@media (max-width: 768px) {
  .kg-width-wide {
    width: 100vw;
    margin: 2rem calc(50% - 50vw);
  }
  .kg-bookmark-thumbnail { display: none; }
}