/* Hyva blog: reuse the storefront's mode-aware palette and type scale. */
body[class*="amblog-"] {
    background: var(--color-bg);
    color: var(--color-fg);
}
body[class*="amblog-"] #maincontent {
    padding-block: calc(var(--spacing) * 10) calc(var(--spacing) * 20);
}
body[class*="amblog-"] #maincontent > :is(.container, .columns) {
    width: 100%;
    max-width: var(--hh-page-width);
    margin-inline: auto;
    padding-inline: calc(var(--spacing) * 6);
}
body[class*="amblog-"] #maincontent > .columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) calc(var(--spacing) * 72);
    align-items: start;
    gap: calc(var(--spacing) * 8);
}
body[class*="amblog-"] #maincontent :is(.column.main, .sidebar, .amblog-content) {
    min-width: 0;
    width: 100%;
}
body[class*="amblog-"] #maincontent .page-title {
    width: 100%;
    margin: 0 0 calc(var(--spacing) * 8);
    padding-bottom: calc(var(--spacing) * 6);
    border-bottom: 1px solid var(--color-line);
    color: var(--color-fg);
    font-family: var(--font-display);
    font-size: var(--text-5xl);
    font-weight: 700;
    line-height: var(--text-5xl--line-height);
    text-wrap: balance;
}
body[class*="amblog-"] #maincontent a {
    color: inherit;
    text-decoration: none;
}
body[class*="amblog-"] #maincontent a:hover {
    color: var(--color-accent-ink);
}
body[class*="amblog-"] #maincontent :is(a, button, input, textarea):focus-visible {
    outline: 2px solid var(--color-accent-ink);
    outline-offset: calc(var(--spacing));
}
body[class*="amblog-"] #maincontent :is(.amblog-post-title, .post-title) {
    font-family: var(--font-display);
    font-weight: 700;
    text-transform: none;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: manual;
}
.amblog-container-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: calc(var(--spacing) * 6);
}
.amblog-container-list > .amblog-post-container {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
}
.amblog-container-list > .amblog-post-container:first-of-type {
    grid-column: 1 / -1;
}
.amblog-container-list .post-image {
    display: block;
    background: var(--color-soft);
}
.amblog-container-list .post-image img,
.amblog-post-container.-post-page > img,
.amblog-post-container.-post-page > .post-image img {
    display: block;
    width: 100%;
    height: auto;
}
.amblog-container-list .amblog-content {
    padding: calc(var(--spacing) * 6);
}
.amblog-container-list > .amblog-post-container:first-of-type .amblog-content {
    padding: calc(var(--spacing) * 8);
}
body[class*="amblog-"] #maincontent .amblog-post-title {
    margin: 0 0 calc(var(--spacing) * 4);
    color: var(--color-fg);
    font-size: var(--text-2xl);
    line-height: var(--text-2xl--line-height);
}
body[class*="amblog-"] #maincontent .amblog-container-list > .amblog-post-container:first-of-type .amblog-post-title {
    font-size: var(--text-4xl);
    line-height: var(--text-4xl--line-height);
    max-width: 40ch;
}
body[class*="amblog-"] :is(.amblog-dates, .amblog-features) {
    color: var(--color-fg-secondary);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}
body[class*="amblog-"] .amblog-dates {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--spacing) * 3);
    margin-bottom: calc(var(--spacing) * 3);
}
.amblog-container-list .amblog-shot {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    color: var(--color-fg-secondary);
    font-size: var(--text-base);
    line-height: var(--text-base--line-height);
}
.amblog-container-list .amblog-shot :is(p, div) { margin: 0; }
.amblog-container-list .amblog-content > .tags { margin-bottom: calc(var(--spacing) * 3); }
.amblog-container-list .amblog-content > .tags:empty { display: none; }
.amblog-container-list .amblog-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 4);
    margin-top: auto;
    padding: calc(var(--spacing) * 5) calc(var(--spacing) * 6);
    border-top: 1px solid var(--color-line);
}
body[class*="amblog-"] :is(.amblog-features, .amblog-wrap, .amblog-no-comments) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing) * 2);
}
body[class*="amblog-"] .amblog-features { gap: calc(var(--spacing) * 3); }
body[class*="amblog-"] .amblog-svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
    fill: currentColor;
}
body[class*="amblog-"] #maincontent .amblog-read {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    min-height: calc(var(--spacing) * 11);
    color: var(--color-accent-ink);
    font-weight: 600;
}
.amblog-read::after { content: "\2192"; }
/* One sidebar flow on all devices, without Luma's off-canvas scripts. */
body[class*="amblog-"] #maincontent .sidebar {
    display: grid;
    gap: calc(var(--spacing) * 5);
}
body[class*="amblog-"] .sidebar :is(.amblog-widget-container, .amblog-author-info) {
    margin: 0;
    padding: calc(var(--spacing) * 5);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
}
body[class*="amblog-"] .sidebar .amblog-title {
    margin: 0 0 calc(var(--spacing) * 4);
    color: var(--color-fg);
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 700;
    line-height: var(--text-xl--line-height);
}
body[class*="amblog-"] .sidebar :is(a, li, .amblog-empty) {
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}
body[class*="amblog-"] .sidebar .amblog-empty { color: var(--color-fg-secondary); }
body[class*="amblog-"] .sidebar img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--radius-md);
}
body[class*="amblog-"] .sidebar .short-description { display: none; }
body[class*="amblog-"] .sidebar .post-item-info + .post-item-info {
    margin-top: calc(var(--spacing) * 5);
    padding-top: calc(var(--spacing) * 5);
    border-top: 1px solid var(--color-line);
}
body[class*="amblog-"] .sidebar .post-item-details { padding-top: calc(var(--spacing) * 2); }
body[class*="amblog-"] .sidebar .amblog-dates { margin-block: calc(var(--spacing) * 2) 0; }
body[class*="amblog-"] #maincontent :is(.tag-list > .amblog-item, .amblog-content > .tags, .amblog-footer > .tags) {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--spacing) * 2);
}
body[class*="amblog-"] #maincontent :is(.amblog-tag, .tags > a) {
    display: inline-block;
    padding: var(--spacing) calc(var(--spacing) * 2);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    background: var(--color-soft);
    color: var(--color-fg-secondary);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
}
body[class*="amblog-"] .amblog-form-container {
    display: flex;
    gap: calc(var(--spacing) * 2);
    align-items: stretch;
}
body[class*="amblog-"] .amblog-form-container .input-box { flex: 1; min-width: 0; }
body[class*="amblog-"] #maincontent :is(input:not([type="checkbox"]):not([type="hidden"]), textarea) {
    width: 100%;
    max-width: 100%;
    min-height: calc(var(--spacing) * 11);
    padding: calc(var(--spacing) * 3);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    background: var(--color-bg);
    color: var(--color-fg);
    font-size: var(--text-base);
}
body[class*="amblog-"] #maincontent input::placeholder { color: var(--color-fg-secondary); }
body[class*="amblog-"] .amblog-form-container button {
    display: grid;
    place-items: center;
    flex: 0 0 calc(var(--spacing) * 11);
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: var(--color-on-primary);
}
/* Preserve complete banner artwork and give rich content a readable measure. */
body.amblog-index-post .amblog-post-container.-post-page {
    overflow: hidden;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
}
body.amblog-index-post .amblog-post-container.-post-page > :is(.amblog-content, .amblog-footer) {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: calc(var(--spacing) * 8);
}
body.amblog-index-post .amblog-post-container.-post-page .amblog-post-title { display: none; }
.amblog-article-body {
    color: var(--color-fg-secondary);
    font-size: var(--text-lg);
    line-height: var(--text-lg--line-height);
    overflow-wrap: anywhere;
}
.amblog-article-body :is(p, ul, ol, blockquote, table) { margin-block: 0 calc(var(--spacing) * 5); }
.amblog-article-body :is(h2, h3, h4) {
    margin-block: calc(var(--spacing) * 8) calc(var(--spacing) * 4);
    color: var(--color-fg);
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    font-weight: 700;
    line-height: var(--text-2xl--line-height);
    text-transform: none;
}
.amblog-article-body :is(ul, ol) { padding-inline-start: calc(var(--spacing) * 6); }
.amblog-article-body ul { list-style: disc; }
.amblog-article-body ol { list-style: decimal; }
.amblog-article-body li + li { margin-top: calc(var(--spacing) * 2); }
body.amblog-index-post #maincontent .amblog-article-body a {
    color: var(--color-accent-ink);
    text-decoration: underline;
    text-underline-offset: var(--spacing);
}
.amblog-article-body img { max-width: 100%; height: auto; }
.amblog-article-body :is(iframe, video) { max-width: 100%; }
.amblog-article-body table { display: block; max-width: 100%; overflow-x: auto; }
.amblog-article-body :is(th, td) { padding: calc(var(--spacing) * 3); border: 1px solid var(--color-line); }
.amblog-search-section { margin-bottom: calc(var(--spacing) * 8); }
.amblog-search-section > .amblog-title { margin-bottom: calc(var(--spacing) * 5); font-size: var(--text-2xl); font-weight: 700; }
.amblog-article-body blockquote { padding-inline-start: calc(var(--spacing) * 5); border-inline-start: 2px solid var(--color-accent-ink); }
.amblog-post-container.-post-page > .amblog-footer { border-top: 1px solid var(--color-line); }
.amblog-navigation-container, .amblog-pager-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: calc(var(--spacing) * 5);
    padding: calc(var(--spacing) * 6);
    border-top: 1px solid var(--color-line);
}
.amblog-navigation { flex: 1; min-width: 0; }
.amblog-navigation-label { display: block; margin-bottom: calc(var(--spacing) * 2); color: var(--color-fg-secondary); font-size: var(--text-sm); }
.amblog-title-link { font-weight: 600; }
.amblog-pager-container, .amblog-container-list > .message { grid-column: 1 / -1; }
.amblog-comments-wrapper {
    margin-top: calc(var(--spacing) * 8);
    padding: calc(var(--spacing) * 6);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
}
.amblog-comments-wrapper > .amblog-title { font-family: var(--font-display); font-size: var(--text-2xl); font-weight: 700; }
.amblog-form-head { display: grid; gap: calc(var(--spacing) * 2); margin-block: calc(var(--spacing) * 5); color: var(--color-fg-secondary); }
.amblog-secondary-title { font-weight: 600; color: var(--color-fg); }
.amblog-fieldset { display: grid; gap: calc(var(--spacing) * 4); padding: 0; margin: 0; border: 0; }
.amblog-customer { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(var(--spacing) * 4); }
.amblog-form-comment .amblog-btn { justify-self: start; min-height: calc(var(--spacing) * 11); padding-inline: calc(var(--spacing) * 5); border-radius: var(--radius-md); background: var(--color-primary); color: var(--color-on-primary); font-weight: 600; }
@media (max-width: 1023px) {
    body[class*="amblog-"] #maincontent > .columns { grid-template-columns: minmax(0, 1fr); }
    body[class*="amblog-"] #maincontent .sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
    body[class*="amblog-"] #maincontent { padding-block: calc(var(--spacing) * 6) calc(var(--spacing) * 12); }
    body[class*="amblog-"] #maincontent > :is(.container, .columns) { padding-inline: calc(var(--spacing) * 4); }
    body[class*="amblog-"] #maincontent .page-title { font-size: var(--text-3xl); line-height: var(--text-3xl--line-height); }
    .amblog-container-list, body[class*="amblog-"] #maincontent .sidebar, .amblog-customer { grid-template-columns: minmax(0, 1fr); }
    body[class*="amblog-"] #maincontent .amblog-container-list > .amblog-post-container:first-of-type .amblog-post-title { font-size: var(--text-2xl); line-height: var(--text-2xl--line-height); }
    .amblog-container-list .amblog-content,
    .amblog-container-list > .amblog-post-container:first-of-type .amblog-content,
    body.amblog-index-post .amblog-post-container.-post-page > :is(.amblog-content, .amblog-footer) { padding: calc(var(--spacing) * 5); }
    .amblog-container-list .amblog-footer { padding: calc(var(--spacing) * 4) calc(var(--spacing) * 5); }
}

/* Complete author states and comfortable metadata at every breakpoint. */
body[class*="amblog-"] .hh-blog-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 calc(var(--spacing) * 8);
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    overflow: hidden;
    border: 1px solid var(--color-line);
    border-radius: 50%;
    background: var(--color-soft);
    color: var(--color-fg-secondary);
}
body[class*="amblog-"] .hh-blog-avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}
body[class*="amblog-"] .hh-blog-avatar-icon,
body[class*="amblog-"] .hh-blog-comment-icon {
    display: block;
    flex-shrink: 0;
    fill: none;
    stroke: currentColor;
}
body[class*="amblog-"] .hh-blog-avatar--profile {
    width: calc(var(--spacing) * 20);
    height: calc(var(--spacing) * 20);
    flex-basis: calc(var(--spacing) * 20);
}
body[class*="amblog-"] .hh-blog-avatar--profile svg {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
}
body[class*="amblog-"] .hh-blog-author-intro {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 5);
    padding: calc(var(--spacing) * 6);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
}
body[class*="amblog-"] .hh-blog-author-copy { min-width: 0; }
body[class*="amblog-"] .hh-blog-author-intro .amblog-title {
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    font-weight: 700;
    line-height: var(--text-2xl--line-height);
}
body[class*="amblog-"] :is(.hh-blog-author-intro, .amblog-author-info) :is(.amblog-job, .amblog-description, .amblog-author-description) {
    margin-top: calc(var(--spacing) * 2);
    color: var(--color-fg-secondary);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}
body[class*="amblog-"] .amblog-author-info .hh-blog-avatar { margin-bottom: calc(var(--spacing) * 4); }
body[class*="amblog-"] .amblog-container-list .amblog-features {
    width: 100%;
    row-gap: calc(var(--spacing) * 3);
    column-gap: calc(var(--spacing) * 5);
}
body[class*="amblog-"] .amblog-container-list .amblog-footer .amblog-read { min-height: calc(var(--spacing) * 8); }
body.amblog-index-post .amblog-post-container.-post-page > .amblog-footer {
    display: grid;
    gap: calc(var(--spacing) * 5);
}
body[class*="amblog-"] #maincontent .sidebar .post-item-details .post-title {
    font-family: var(--font-sans);
    font-weight: 600;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}
@media (max-width: 639px) {
    body[class*="amblog-"] .hh-blog-author-intro { align-items: start; padding: calc(var(--spacing) * 5); }
    body[class*="amblog-"] .hh-blog-author-intro .hh-blog-avatar--profile { flex-basis: calc(var(--spacing) * 12); width: calc(var(--spacing) * 12); height: calc(var(--spacing) * 12); }
    body[class*="amblog-"] .hh-blog-author-intro .hh-blog-avatar--profile svg { width: calc(var(--spacing) * 7); height: calc(var(--spacing) * 7); }
}