/**
 * SM-HS base link pattern (brand identity).
 * Default: purple. Hover/focus/active: pink. Never underline.
 *
 * Low specificity so nav bars, sidebars, CTAs (`.hs-btn`, `.mk-btn`, …)
 * can override safely. Load this after shell CSS.
 *
 * Vars:
 *   --hs-link
 *   --hs-link-hover
 */
:root {
    --hs-link: #7c3aed;
    --hs-link-hover: #ff2d6f;
    /* Brand gradient CTAs: invert on hover (see hs-buttons.css for usage) */
    --hs-grad-flow: linear-gradient(
        90deg,
        #ff2d6f 0%,
        #a855f7 25%,
        #7c3aed 50%,
        #a855f7 75%,
        #ff2d6f 100%
    );
    --hs-grad-flow-size: 200% 100%;
    --hs-grad-flow-pos: 0% 50%;
    --hs-grad-flow-pos-hover: 100% 50%;
    --hs-grad-flow-duration: 0.4s ease;
}

a {
    color: var(--hs-link);
    text-decoration: none;
}

a:hover,
a:focus,
a:focus-visible,
a:active {
    color: var(--hs-link-hover);
    text-decoration: none;
}

/* Primary / alert CTA buttons always white text (including <a> + hover) */
a.hs-btn-primary,
a.hs-btn-primary:hover,
a.hs-btn-primary:focus,
a.hs-btn-primary:focus-visible,
a.hs-btn-primary:active,
a.hs-btn-alert,
a.hs-btn-alert:hover,
a.hs-btn-alert:focus,
a.hs-btn-alert:focus-visible,
a.hs-btn-alert:active,
a.mk-btn-primary,
a.mk-btn-primary:link,
a.mk-btn-primary:visited,
a.mk-btn-primary:hover,
a.mk-btn-primary:focus,
a.mk-btn-primary:focus-visible,
a.mk-btn-primary:active {
    color: #fff;
}

a.hs-btn-secondary:hover,
a.hs-btn-secondary:focus,
a.hs-btn-secondary:focus-visible,
a.hs-btn-secondary:active {
    color: var(--hs-link-hover);
}

/* Shared product breadcrumbs (family after hero, admin top of content) */
.hs-breadcrumb-wrap {
    margin: 0.65rem 0 0.15rem;
    padding: 0;
}

.hs-breadcrumb {
    margin: 0;
    padding: 0.45rem 0.7rem;
    border: 1px solid rgba(17, 24, 39, 0.1);
    border-radius: 5px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 246, 255, 0.92)),
        radial-gradient(120% 80% at 0% 0%, rgba(255, 45, 111, 0.06), transparent 55%);
    box-shadow: 0 0 0 1px rgba(124, 58, 237, 0.04);
}

.hs-breadcrumb__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.2rem 0.15rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.hs-breadcrumb__item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-family: "Chakra Petch", system-ui, sans-serif;
    font-size: 0.82rem;
    line-height: 1.3;
}

.hs-breadcrumb__link {
    color: #5b21b6;
    font-weight: 500;
}

.hs-breadcrumb__link:hover,
.hs-breadcrumb__link:focus-visible {
    color: #ff2d6f;
}

.hs-breadcrumb__current {
    color: #12131a;
    font-weight: 600;
}

.hs-breadcrumb__sep {
    color: rgba(124, 58, 237, 0.55);
    font-weight: 500;
    user-select: none;
}

.hs-breadcrumb--profile {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.hs-breadcrumb--profile .hs-breadcrumb__item {
    font-size: 0.9rem;
}

.hs-breadcrumb--profile .hs-breadcrumb__sep {
    margin: 0 0.15rem;
}