/* === Hero — recipe archive ============================================
 *
 * Top-of-page header for the recipe CPT archive and recipe_type / region
 * term archives. Centered crumbs + Italiana title + italic stand + count
 * line flanked by hairline rules. The wrapper carries
 * `view-transition-name: sb-archive-hero` so the in-place axis/sort swap
 * crossfades this block (see assets/js/archive-axis-swap.js).
 *
 * Distinct from:
 *   - patterns/hero/hero-category/   (default-taxonomy term page header)
 *   - patterns/hero/hero-collection/ (single collection landing hero)
 */
.sb-hero-archive {
    padding: var(--wp--preset--spacing--xl) var(--wp--preset--spacing--lg) var(--wp--preset--spacing--md);
    text-align: center;
}
.sb-hero-archive__inner {
    max-width: 760px;
    margin: 0 auto;
}
.sb-hero-archive__crumbs {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    font-family: var(--wp--preset--font-family--manrope);
    font-size: var(--wp--preset--font-size--eyebrow);
    text-transform: uppercase;
    letter-spacing: 0.28em;
    color: var(--wp--preset--color--saddle);
    font-weight: 600;
    margin: 0 0 var(--wp--preset--spacing--sm);
}
.sb-hero-archive__crumbs a {
    color: var(--wp--preset--color--saddle);
    text-decoration: none;
}
.sb-hero-archive__crumbs a:hover { text-decoration: underline; }
.sb-hero-archive__crumbs span[aria-hidden="true"] { color: rgba(42, 26, 10, 0.45); }
.sb-hero-archive__title {
    font-family: var(--wp--preset--font-family--italiana);
    font-size: var(--wp--preset--font-size--hero-title-lg);
    letter-spacing: 0.12em;
    line-height: 1;
    margin: 0 0 calc(var(--wp--preset--spacing--sm-plus) - var(--wp--preset--spacing--xxs));
    color: var(--wp--preset--color--ink);
    font-weight: 400;
    text-wrap: balance;
}
.sb-hero-archive__stand {
    font-family: var(--wp--preset--font-family--cormorant);
    font-style: italic;
    font-size: var(--wp--preset--font-size--card-title);
    line-height: 1.5;
    color: var(--wp--preset--color--ink);
    margin: 0 auto var(--wp--preset--spacing--sm);
    max-width: 580px;
    text-wrap: pretty;
    hyphens: auto;
    -webkit-hyphens: auto;
}
.sb-hero-archive__count {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    font-family: var(--wp--preset--font-family--manrope);
    font-size: var(--wp--preset--font-size--meta);
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--wp--preset--color--saddle);
    font-weight: 600;
}
.sb-hero-archive__count::before,
.sb-hero-archive__count::after {
    content: "";
    height: 1px;
    flex: 0 0 60px;
    background: var(--wp--preset--color--saddle);
    opacity: 0.4;
}

/* Names the wrapper so the in-place archive swap (axis/sort/page change)
   crossfades just this block rather than the whole document. */
@supports (view-transition-name: a) {
    .sb-hero-archive { view-transition-name: sb-archive-hero; }
}

@media (max-width: 800px) {
    .sb-hero-archive { padding: calc(var(--wp--preset--spacing--md) + var(--wp--preset--spacing--xs)) var(--wp--preset--spacing--sm) var(--wp--preset--spacing--sm); }
    .sb-hero-archive__title { font-size: var(--wp--preset--font-size--display); letter-spacing: 0.1em; }
    .sb-hero-archive__stand { font-size: var(--wp--preset--font-size--body); }
}