/* Blog, single post, tool review, 404, static pages. Tokens only. */

.promptix-blog { padding-block: 32px 56px; }
.promptix-blog__head { display: grid; gap: 16px; margin-bottom: 24px; }
.promptix-blog__head h1 { margin: 0; color: var(--text-heading); }
.promptix-blog__search { display: flex; gap: 8px; max-width: 560px; }
.promptix-blog__search .input { flex: 1; min-width: 0; }
.promptix-blog__tabs { display: flex; gap: 8px; flex-wrap: wrap; }
.promptix-blog__tabs a { padding: 6px 14px; border: 1px solid var(--border-default); border-radius: var(--radius-pill); color: var(--text-secondary); text-decoration: none; background: var(--bg-card); }
.promptix-blog__tabs a:hover { border-color: var(--border-strong); }
.promptix-blog__tabs a[aria-current="page"] { background: var(--color-primary); border-color: var(--color-primary); color: var(--text-inverse); }

.promptix-featured-story { display: grid; grid-template-columns: 1.2fr 1fr; overflow: hidden; margin-bottom: 32px; }
.promptix-featured-story__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.promptix-featured-story__body { padding: 28px; display: grid; gap: 12px; align-content: center; justify-items: start; }
.promptix-featured-story__body h2 { margin: 0; }
.promptix-featured-story__body h2 a { color: var(--text-heading); text-decoration: none; }

.promptix-blog__layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 32px; align-items: start; }
.promptix-blog__side { display: grid; gap: 16px; position: sticky; top: calc(var(--header-height, 72px) + 16px); }
.promptix-side { padding: 20px; }
.promptix-side h2 { margin: 0 0 12px; font-size: 1.125rem; color: var(--text-heading); }
.promptix-side__rank { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.promptix-side__rank li { display: flex; gap: 12px; align-items: baseline; }
.promptix-side__rank span { font-weight: 700; color: var(--color-primary); font-variant-numeric: tabular-nums; }
.promptix-side__rank a { color: var(--text-heading); text-decoration: none; }
.promptix-side__cats { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.promptix-side__cats li { display: flex; justify-content: space-between; }
.promptix-side__cats span { color: var(--text-muted); }
.promptix-card--post .promptix-card__media img { width: 100%; height: auto; display: block; }

/* Single post */
.promptix-post { padding-block: 24px 56px; }
.promptix-post__head { max-width: 860px; display: grid; gap: 12px; justify-items: start; margin-bottom: 24px; }
.promptix-post__title { margin: 0; font-size: clamp(1.75rem, 4vw, 2.75rem); line-height: 1.15; color: var(--text-heading); }
.promptix-post__summary { padding: 16px; margin: 0; }
.promptix-post__image { margin: 0 0 24px; }
.promptix-post__image img { width: 100%; height: auto; border-radius: var(--radius-lg); display: block; }
.promptix-post__layout { display: grid; grid-template-columns: 260px minmax(0, 760px); gap: 40px; align-items: start; }
.promptix-toc { padding: 16px; position: sticky; top: calc(var(--header-height, 72px) + 16px); font-size: .9375rem; }
.promptix-toc ol { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 4px; }
.promptix-toc li.is-h3 { padding-left: 14px; }
.promptix-toc a { color: var(--text-secondary); text-decoration: none; display: block; padding: 4px 8px; border-left: 2px solid transparent; }
.promptix-toc a:hover { color: var(--text-heading); }
.promptix-toc a.is-active { color: var(--color-primary); border-left-color: var(--color-primary); font-weight: 600; }

.promptix-post__content { font-size: 18px; line-height: 1.6; color: var(--text-body); min-width: 0; }
.promptix-post__content h2,
.promptix-post__content h3 { color: var(--text-heading); scroll-margin-top: calc(var(--header-height, 72px) + 16px); }
.promptix-post__content img { max-width: 100%; height: auto; }
.promptix-post__content table { display: block; overflow-x: auto; border-collapse: collapse; max-width: 100%; }
.promptix-post__content th,
.promptix-post__content td { padding: 8px 12px; border: 1px solid var(--border-default); }
.promptix-post__content pre { overflow-x: auto; max-width: 100%; }

/* Prompt Snippet (core/code + core/preformatted style) */
.is-style-promptix-snippet { position: relative; padding: 16px 16px 16px; background: var(--bg-subtle); border: 1px solid var(--border-default); border-radius: var(--radius-md); font-family: var(--font-mono); font-size: .9375rem; white-space: pre-wrap; word-break: break-word; }
.is-style-promptix-snippet .promptix-copy { position: absolute; top: 8px; right: 8px; }

.promptix-proscons { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 32px 0; }
.promptix-proscons section { padding: 20px; }
.promptix-proscons h2 { margin-top: 0; }
.promptix-proscons__pros { border-top: 3px solid var(--color-success); }
.promptix-proscons__cons { border-top: 3px solid var(--color-error); }
.promptix-verdict { padding: 20px; margin: 24px 0; }

.promptix-post__foot { display: grid; gap: 20px; margin-top: 40px; max-width: 860px; }
.promptix-share { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.promptix-author-box { display: flex; gap: 16px; padding: 20px; align-items: center; }
.promptix-author-box h2 { margin: 0 0 4px; font-size: 1.125rem; }
.promptix-author-box .promptix-avatar { border-radius: 50%; }
.promptix-related { margin-top: 48px; }

/* Review card */
.promptix-review-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; padding: 24px; margin-bottom: 32px; align-items: center; }
.promptix-review-card__score { display: flex; gap: 20px; align-items: center; }
.promptix-review-card__score h2 { margin: 0 0 4px; color: var(--text-heading); }
.promptix-ring { width: 120px; height: 120px; flex: none; transform: rotate(-90deg); }
.promptix-ring circle { fill: none; stroke-width: 8; }
.promptix-ring__bg { stroke: var(--bg-subtle); }
.promptix-ring__fg { stroke: var(--color-primary); stroke-linecap: round; transition: stroke-dashoffset 1s ease; }
.promptix-ring text { transform: rotate(90deg); transform-origin: 50% 50%; fill: var(--text-heading); font-size: 26px; font-weight: 700; }
.promptix-review-card__bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.promptix-review-card__bars li { display: grid; grid-template-columns: 1fr 1.4fr 32px; gap: 10px; align-items: center; font-size: .9375rem; }
.promptix-disclosure { margin: 8px 0 0; font-size: .8125rem; color: var(--text-secondary); }
.promptix-review-alts { margin-bottom: 32px; }

/* 404 + static pages */
.promptix-404 { text-align: center; padding-block: 64px; display: grid; gap: 16px; justify-items: center; }
.promptix-404__code { margin: 0; font-size: clamp(5rem, 18vw, 10rem); font-weight: 800; line-height: 1; background: var(--gradient-primary); -webkit-background-clip: text; background-clip: text; color: transparent; }
.promptix-404__actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.promptix-404 .promptix-hero__search { width: 100%; }
.promptix-page { padding-block: 32px 56px; max-width: 860px; }
.promptix-page__title { color: var(--text-heading); }
.promptix-faq details { padding: 14px 18px; margin-bottom: 8px; border: 1px solid var(--border-default); border-radius: var(--radius-md); background: var(--bg-card); }
.promptix-faq summary { cursor: pointer; font-weight: 600; color: var(--text-heading); }
.promptix-faq-search { margin-bottom: 16px; }

@media (max-width: 1024px) {
	.promptix-blog__layout,
	.promptix-post__layout { grid-template-columns: 1fr; }
	.promptix-blog__side,
	.promptix-toc { position: static; }
	.promptix-blog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.promptix-review-card { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
	.promptix-featured-story { grid-template-columns: 1fr; }
	.promptix-blog__grid { grid-template-columns: 1fr; }
	.promptix-proscons { grid-template-columns: 1fr; }
	.promptix-review-card__score { flex-direction: column; align-items: flex-start; }
}

.promptix-page--toc { max-width: var(--container-width); }

/* Comments & Discussion. */
.promptix-comments { margin-top: 32px; padding: 24px; }
.promptix-comments__title { margin: 0 0 16px; font-size: 20px; }
.promptix-comments__form { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; }
.promptix-comments__form > p { flex: 1 1 100%; margin: 0; }
.promptix-comments__form .comment-form-author,
.promptix-comments__form .comment-form-email { flex: 1 1 calc(50% - 6px); min-width: 200px; }
.promptix-comments__form .comment-form-url,
.promptix-comments__form .comment-form-cookies-consent,
.promptix-comments__form .comment-notes { display: none; }
.promptix-comments__form label { display: block; margin-bottom: 4px; font-size: 13px; color: var(--text-secondary); }
.promptix-comments__form textarea,
.promptix-comments__form input[type="text"],
.promptix-comments__form input[type="email"] {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md, 8px);
  background: var(--bg-card);
  color: var(--text-primary);
  font: inherit;
}
.promptix-comments__form textarea { min-height: 84px; resize: vertical; }
.promptix-comments__form textarea:focus,
.promptix-comments__form input:focus { outline: 2px solid var(--color-primary); outline-offset: 1px; }
.promptix-comments__form .form-submit { text-align: right; }
.promptix-comments__form .logged-in-as { font-size: 13px; color: var(--text-secondary); }

.promptix-comments__list,
.promptix-comments__list .children { margin: 0; padding: 0; list-style: none; }
.promptix-comments__list .children { margin-left: 56px; }
.promptix-comment { padding: 16px 0; border-top: 1px solid var(--border-default); }
.promptix-comment__body { display: flex; gap: 14px; align-items: flex-start; }
.promptix-comment__body .promptix-avatar { border-radius: 50%; flex: none; }
.promptix-comment__main { flex: 1; min-width: 0; }
.promptix-comment__head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; }
.promptix-comment__author { color: var(--text-heading); }
.promptix-comment__author a { color: inherit; }
.promptix-comment__time { font-size: 13px; color: var(--text-secondary); }
.promptix-comment__text { margin-top: 6px; color: var(--text-primary); }
.promptix-comment__text p { margin: 0 0 8px; }
.promptix-comment__pending { margin: 4px 0 0; font-size: 13px; color: var(--color-warning, #b45309); }
.promptix-comment__actions { margin-top: 4px; }
.promptix-comment__actions a { font-size: 13px; font-weight: 600; color: var(--color-primary); }
.promptix-comments__empty { margin: 0; color: var(--text-secondary); }

@media (max-width: 600px) {
  .promptix-comments { padding: 16px; }
  .promptix-comments__list .children { margin-left: 24px; }
}
