/* aisd components.css — generated by Ai Studio Design By MaFady.com.
   tree-shaken bricks + template styles. Standalone: no external URL, tokens --aisd-* only. */

/* ── primitive: button (library/primitives/button) ── */
/* button — scoped .aisd-p-button · tokens only · logical properties ·
   44px targets (md/lg) · transform/opacity motion. Budget: 120. */

.aisd-p-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--aisd-space-2xs);
    min-block-size: 2.75rem;
    padding-block: var(--aisd-space-2xs);
    padding-inline: var(--aisd-space-md);
    border-radius: var(--aisd-radius-button);
    font-weight: 600;
    font-size: var(--aisd-step-0);
    line-height: var(--aisd-line-tight);
    text-decoration: none;
    transition: transform var(--aisd-dur-1) var(--aisd-ease-out), opacity var(--aisd-dur-1) var(--aisd-ease-out);
}

.aisd-p-button:hover {
    transform: translateY(-2px);
}

.aisd-p-button:active {
    transform: translateY(0);
}

.aisd-p-button--sm {
    min-block-size: 2.25rem;
    padding-inline: var(--aisd-space-sm);
    font-size: var(--aisd-step--1);
}

.aisd-p-button--lg {
    min-block-size: 3.25rem;
    padding-inline: var(--aisd-space-lg);
    font-size: var(--aisd-step-1);
}

.aisd-p-button--full {
    inline-size: 100%;
}

.aisd-p-button--solid {
    background: var(--aisd-brand);
    color: var(--aisd-on-brand);
}

.aisd-p-button--outline {
    background: transparent;
    color: var(--aisd-brand-text);
    box-shadow: inset 0 0 0 2px var(--aisd-border-strong);
}

.aisd-p-button--ghost {
    background: transparent;
    color: var(--aisd-brand-text);
}

.aisd-p-button--ghost:hover {
    background: var(--aisd-surface-2);
}

.aisd-p-button--gradient {
    background: var(--aisd-gradient-brand);
    color: var(--aisd-on-brand);
}

.aisd-p-button--gradient:hover {
    box-shadow: var(--aisd-glow);
}

.aisd-p-button--glass {
    background: var(--aisd-glass-bg);
    color: var(--aisd-ink);
    box-shadow: inset 0 0 0 1px var(--aisd-glass-border);
    backdrop-filter: blur(var(--aisd-glass-blur));
}

.aisd-p-button svg {
    flex: none;
}

/* ── primitive: stat (library/primitives/stat) ── */
/* stat — scoped .aisd-p-stat · tokens only · logical properties. Budget: 80. */

.aisd-p-stat {
    display: flex;
    flex-direction: column;
    gap: var(--aisd-space-3xs);
}

.aisd-p-stat--card {
    padding: var(--aisd-space-md);
    border-radius: var(--aisd-radius-lg);
    background: var(--aisd-surface-2);
    box-shadow: var(--aisd-elev-1);
}

.aisd-p-stat__value {
    font-family: var(--aisd-font-heading);
    font-size: var(--aisd-step-4);
    font-weight: 700;
    line-height: var(--aisd-line-tight);
    color: var(--aisd-ink);
}

.aisd-p-stat--gradient .aisd-p-stat__value {
    background: var(--aisd-gradient-text);
    -webkit-background-clip: text;
    background-clip: text;
    color: var(--aisd-brand-text);
    -webkit-text-fill-color: transparent;
}

.aisd-p-stat__label {
    font-weight: 600;
    color: var(--aisd-ink);
}

.aisd-p-stat__hint {
    font-size: var(--aisd-step--1);
    color: var(--aisd-ink-muted);
}

/* ── pattern: cta-row (library/patterns/cta-row) ── */
/* cta-row — scoped .aisd-pt-cta-row · tokens only. Budget: 50. */

.aisd-pt-cta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--aisd-space-xs);
}

.aisd-pt-cta-row--center {
    justify-content: center;
}

.aisd-pt-cta-row--stacked {
    flex-direction: column;
    align-items: stretch;
}

@media (min-width: 640px) {
    .aisd-pt-cta-row--stacked {
        flex-direction: row;
        align-items: center;
    }
}

/* ── pattern: footer-cols (library/patterns/footer-cols) ── */
/* footer-cols — scoped .aisd-pt-footer-cols · tokens only. Budget: 90. */

.aisd-pt-footer-cols {
    display: grid;
    gap: var(--aisd-space-lg);
}

@media (min-width: 768px) {
    .aisd-pt-footer-cols--two {
        grid-template-columns: 2fr 1fr;
    }

    .aisd-pt-footer-cols--three {
        grid-template-columns: 2fr 1fr 1fr 1fr;
    }
}

.aisd-pt-footer-cols__brand {
    font-family: var(--aisd-font-heading);
    font-size: var(--aisd-step-1);
    font-weight: 700;
    color: var(--aisd-ink);
}

.aisd-pt-footer-cols__about {
    margin-block-start: var(--aisd-space-2xs);
    max-inline-size: 32ch;
    color: var(--aisd-ink-muted);
    line-height: var(--aisd-line-relaxed);
}

.aisd-pt-footer-cols__title {
    margin-block-end: var(--aisd-space-2xs);
    font-size: var(--aisd-step--1);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--aisd-ink);
}

.aisd-pt-footer-cols__col ul {
    display: flex;
    flex-direction: column;
    gap: var(--aisd-space-3xs);
    margin: 0;
    padding: 0;
    list-style: none;
}

.aisd-pt-footer-cols__col a {
    color: var(--aisd-ink-muted);
    text-decoration: none;
}

.aisd-pt-footer-cols__col a:hover {
    color: var(--aisd-brand-text);
    text-decoration: underline;
}

/* ── pattern: nav-bar (library/patterns/nav-bar) ── */
/* nav-bar — scoped .aisd-pt-nav-bar · tokens only. Budget: 70. */

.aisd-pt-nav-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--aisd-space-sm);
}

.aisd-pt-nav-bar__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--aisd-space-2xs);
    margin: 0;
    padding: 0;
    list-style: none;
}

.aisd-pt-nav-bar__link {
    display: inline-flex;
    align-items: center;
    min-block-size: 2.75rem;
    padding-block: var(--aisd-space-3xs);
    padding-inline: var(--aisd-space-xs);
    border-radius: var(--aisd-radius-sm);
    color: var(--aisd-ink);
    font-weight: 500;
    text-decoration: none;
}

.aisd-pt-nav-bar__link:hover {
    color: var(--aisd-brand-text);
    background: var(--aisd-surface-2);
}

.aisd-pt-nav-bar--pill .aisd-pt-nav-bar__list {
    padding: var(--aisd-space-3xs);
    border-radius: var(--aisd-radius-pill);
    background: var(--aisd-glass-bg);
    box-shadow: inset 0 0 0 1px var(--aisd-glass-border);
    backdrop-filter: blur(var(--aisd-glass-blur));
}

.aisd-pt-nav-bar--pill .aisd-pt-nav-bar__link {
    border-radius: var(--aisd-radius-pill);
}

.aisd-pt-nav-bar__ctas {
    display: inline-flex;
    align-items: center;
    gap: var(--aisd-space-2xs);
    margin-inline-start: auto;
}

/* ── pattern: stat-chips (library/patterns/stat-chips) ── */
/* stat-chips — scoped .aisd-pt-stat-chips · tokens only. Budget: 50. */

.aisd-pt-stat-chips {
    display: grid;
    gap: var(--aisd-space-md);
    padding: 0;
    margin: 0;
    list-style: none;
}

.aisd-pt-stat-chips--row {
    grid-template-columns: repeat(2, 1fr);
}

.aisd-pt-stat-chips--grid {
    grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 768px) {
    .aisd-pt-stat-chips--row {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* ── section: browser-frame (library/sections/media/browser-frame) ── */
/* browser-frame — scoped .aisd-s-browser-frame · tokens only. Budget: 110. */

.aisd-s-browser-frame {
    padding-block: var(--aisd-space-section);
    background: var(--aisd-surface-1);
}

.aisd-s-browser-frame__inner {
    display: flex;
    flex-direction: column;
    gap: var(--aisd-space-lg);
}

.aisd-s-browser-frame__head {
    max-inline-size: 46rem;
}

.aisd-s-browser-frame__eyebrow {
    margin-block-end: var(--aisd-space-2xs);
    color: var(--aisd-brand-text);
    font-size: var(--aisd-step--1);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.aisd-s-browser-frame__title {
    color: var(--aisd-ink);
    text-wrap: balance;
}

.aisd-s-browser-frame__frame {
    margin: 0;
    border-radius: var(--aisd-radius-lg);
    background: var(--aisd-surface-2);
    box-shadow: var(--aisd-elev-3);
    overflow: hidden;
}

.aisd-s-browser-frame--glow .aisd-s-browser-frame__frame {
    box-shadow: var(--aisd-elev-3), var(--aisd-glow);
}

.aisd-s-browser-frame__bar {
    display: flex;
    align-items: center;
    gap: var(--aisd-space-sm);
    padding-block: var(--aisd-space-2xs);
    padding-inline: var(--aisd-space-sm);
    background: var(--aisd-surface-4);
    box-shadow: inset 0 -1px 0 var(--aisd-border);
}

.aisd-s-browser-frame__dots {
    display: inline-flex;
    gap: var(--aisd-space-3xs);
}

.aisd-s-browser-frame__dots i {
    inline-size: 0.65rem;
    block-size: 0.65rem;
    border-radius: var(--aisd-radius-pill);
    background: var(--aisd-border-strong);
}

.aisd-s-browser-frame__url {
    flex: 1;
    max-inline-size: 28rem;
    padding-block: var(--aisd-space-3xs);
    padding-inline: var(--aisd-space-sm);
    border-radius: var(--aisd-radius-pill);
    background: var(--aisd-surface-2);
    color: var(--aisd-ink-muted);
    font-family: var(--aisd-font-mono);
    font-size: var(--aisd-step--1);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.aisd-s-browser-frame__viewport {
    aspect-ratio: 16 / 9;
    background: var(--aisd-surface-3);
}

.aisd-s-browser-frame__viewport img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
}

.aisd-s-browser-frame__placeholder {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    background: var(--aisd-gradient-brand);
    opacity: 0.8;
}

.aisd-s-browser-frame__caption {
    padding: var(--aisd-space-sm);
    color: var(--aisd-ink-muted);
    font-size: var(--aisd-step--1);
    text-align: center;
}

/* ── section: cta-band (library/sections/marketing/cta-band) ── */
/* cta-band — scoped .aisd-s-cta-band · tokens only. Budget: 80. */

.aisd-s-cta-band {
    padding-block: var(--aisd-space-2xl);
    background: var(--aisd-surface-1);
    color: var(--aisd-ink);
}

.aisd-s-cta-band__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--aisd-space-sm);
    text-align: center;
}

.aisd-s-cta-band__title {
    max-inline-size: min(24ch, 100%);
    color: var(--aisd-ink);
    text-wrap: balance;
}

.aisd-s-cta-band__body {
    max-inline-size: 55ch;
    color: var(--aisd-ink-muted);
    font-size: var(--aisd-step-1);
    line-height: var(--aisd-line-relaxed);
}

.aisd-s-cta-band--gradient {
    background: var(--aisd-gradient-surface);
}

.aisd-s-cta-band--glass .aisd-s-cta-band__inner {
    padding: var(--aisd-space-xl);
    border-radius: var(--aisd-radius-lg);
    background: var(--aisd-glass-bg);
    box-shadow: inset 0 0 0 1px var(--aisd-glass-border), var(--aisd-elev-2);
    backdrop-filter: blur(var(--aisd-glass-blur));
}

/* ── section: faq (library/sections/content/faq) ── */
/* faq — scoped .aisd-s-faq · tokens only · native details/summary. Budget: 90. */

.aisd-s-faq {
    padding-block: var(--aisd-space-section);
    background: var(--aisd-surface-1);
}

.aisd-s-faq__grid {
    display: grid;
    /* Shrinkable single column on mobile (not the implicit `auto` track, which
       can size past the viewport on narrow screens). */
    grid-template-columns: minmax(0, 1fr);
    gap: var(--aisd-space-lg);
}

@media (min-width: 1024px) {
    .aisd-s-faq--split .aisd-s-faq__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
        align-items: start;
    }
}

.aisd-s-faq__eyebrow {
    margin-block-end: var(--aisd-space-2xs);
    color: var(--aisd-brand-text);
    font-size: var(--aisd-step--1);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.aisd-s-faq__title {
    color: var(--aisd-ink);
    text-wrap: balance;
}

.aisd-s-faq__lede {
    margin-block-start: var(--aisd-space-xs);
    color: var(--aisd-ink-muted);
    line-height: var(--aisd-line-relaxed);
}

.aisd-s-faq__item {
    border-radius: var(--aisd-radius-md);
    background: var(--aisd-surface-2);
    box-shadow: var(--aisd-elev-1);
}

.aisd-s-faq__item + .aisd-s-faq__item {
    margin-block-start: var(--aisd-space-xs);
}

.aisd-s-faq__question {
    padding: var(--aisd-space-sm) var(--aisd-space-md);
    min-block-size: 2.75rem;
    cursor: pointer;
    font-weight: 600;
    color: var(--aisd-ink);
    list-style-position: inside;
}

.aisd-s-faq__question:hover {
    color: var(--aisd-brand-text);
}

.aisd-s-faq__answer {
    padding-block: 0 var(--aisd-space-sm);
    padding-inline: var(--aisd-space-md);
    color: var(--aisd-ink-muted);
    line-height: var(--aisd-line-relaxed);
    max-inline-size: 65ch;
}

/* ── section: feature-inventory (library/sections/marketing/feature-inventory) ── */
/* feature-inventory — scoped .aisd-s-feature-inventory · tokens only. Budget: 70. */

.aisd-s-feature-inventory {
    padding-block: var(--aisd-space-section);
    background: var(--aisd-surface-1);
}

.aisd-s-feature-inventory__head {
    max-inline-size: 46rem;
    margin-block-end: var(--aisd-space-lg);
}

.aisd-s-feature-inventory__eyebrow {
    margin-block-end: var(--aisd-space-2xs);
    color: var(--aisd-brand-text);
    font-size: var(--aisd-step--1);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.aisd-s-feature-inventory__title {
    color: var(--aisd-ink);
    text-wrap: balance;
}

.aisd-s-feature-inventory__list {
    display: grid;
    gap: var(--aisd-space-xs) var(--aisd-space-md);
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (min-width: 640px) {
    .aisd-s-feature-inventory__list {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .aisd-s-feature-inventory--three-cols .aisd-s-feature-inventory__list {
        grid-template-columns: repeat(3, 1fr);
    }
}

.aisd-s-feature-inventory__item {
    display: flex;
    align-items: baseline;
    gap: var(--aisd-space-2xs);
    color: var(--aisd-ink);
}

.aisd-s-feature-inventory__item svg {
    flex: none;
    color: var(--aisd-brand-text);
}

/* ── section: features-alternating (library/sections/marketing/features-alternating) ── */
/* features-alternating — scoped .aisd-s-features-alternating · tokens only.
   Budget: 110. */

.aisd-s-features-alternating {
    padding-block: var(--aisd-space-section);
    background: var(--aisd-surface-1);
}

.aisd-s-features-alternating__head {
    max-inline-size: 46rem;
    margin-block-end: var(--aisd-space-xl);
}

.aisd-s-features-alternating__eyebrow {
    margin-block-end: var(--aisd-space-2xs);
    color: var(--aisd-brand-text);
    font-size: var(--aisd-step--1);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.aisd-s-features-alternating__title {
    color: var(--aisd-ink);
    text-wrap: balance;
}

.aisd-s-features-alternating__row {
    display: grid;
    gap: var(--aisd-space-md);
    align-items: center;
    padding-block: var(--aisd-space-lg);
}

.aisd-s-features-alternating__row + .aisd-s-features-alternating__row {
    box-shadow: inset 0 1px 0 var(--aisd-border);
}

@media (min-width: 768px) {
    .aisd-s-features-alternating__row {
        grid-template-columns: 1fr 1fr;
    }

    .aisd-s-features-alternating__row:nth-child(odd) .aisd-s-features-alternating__text {
        order: 2;
    }

    .aisd-s-features-alternating__row:nth-child(odd) .aisd-s-features-alternating__panel {
        order: 1;
    }
}

.aisd-s-features-alternating__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 2.75rem;
    block-size: 2.75rem;
    margin-block-end: var(--aisd-space-xs);
    border-radius: var(--aisd-radius-md);
    background: var(--aisd-surface-3);
    color: var(--aisd-brand-text);
}

.aisd-s-features-alternating__text h3 {
    color: var(--aisd-ink);
}

.aisd-s-features-alternating__text p {
    margin-block-start: var(--aisd-space-xs);
    color: var(--aisd-ink-muted);
    line-height: var(--aisd-line-relaxed);
}

.aisd-s-features-alternating__panel {
    min-block-size: 12rem;
    border-radius: var(--aisd-radius-lg);
    background: var(--aisd-gradient-brand);
    opacity: 0.85;
    box-shadow: var(--aisd-elev-2);
}

/* ── section: footer-columns (library/sections/footer/footer-columns) ── */
/* footer-columns — scoped .aisd-s-footer-columns · tokens only. Budget: 60. */

.aisd-s-footer-columns {
    background: var(--aisd-surface-2);
    color: var(--aisd-ink);
    padding-block: var(--aisd-space-2xl) var(--aisd-space-lg);
    box-shadow: inset 0 1px 0 var(--aisd-border);
}

.aisd-s-footer-columns__legal {
    margin-block-start: var(--aisd-space-lg);
    padding-block-start: var(--aisd-space-sm);
    box-shadow: inset 0 1px 0 var(--aisd-border);
    color: var(--aisd-ink-muted);
    font-size: var(--aisd-step--1);
}

/* ── section: header-split (library/sections/header/header-split) ── */
/* header-split — scoped .aisd-s-header-split · tokens only. Budget: 80. */

.aisd-s-header-split {
    background: var(--aisd-surface-1);
    box-shadow: inset 0 -1px 0 var(--aisd-border);
}

.aisd-s-header-split--blur {
    background: var(--aisd-glass-bg);
    backdrop-filter: blur(var(--aisd-glass-blur));
}

.aisd-s-header-split__bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--aisd-space-sm);
    padding-block: var(--aisd-space-sm);
}

.aisd-s-header-split__brand {
    font-family: var(--aisd-font-heading);
    font-size: var(--aisd-step-1);
    font-weight: 700;
    color: var(--aisd-ink);
    text-decoration: none;
}

.aisd-s-header-split__brand:hover {
    color: var(--aisd-brand-text);
}

.aisd-s-header-split__nav {
    flex: 1;
}

.aisd-s-header-split__actions {
    display: flex;
    align-items: center;
    gap: var(--aisd-space-2xs);
}

/* ── section: hero-stats (library/sections/hero/hero-stats) ── */
/* hero-stats — scoped .aisd-s-hero-stats · tokens only. Budget: 90. */

.aisd-s-hero-stats {
    background: var(--aisd-gradient-surface);
    padding-block: var(--aisd-space-2xl);
}

.aisd-s-hero-stats__eyebrow {
    margin-block-end: var(--aisd-space-xs);
    color: var(--aisd-brand-text);
    font-size: var(--aisd-step--1);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.aisd-s-hero-stats__title {
    max-inline-size: min(22ch, 100%);
    color: var(--aisd-ink);
    font-size: var(--aisd-step-5);
    letter-spacing: -0.02em;
    text-wrap: balance;
}

.aisd-s-hero-stats__lede {
    margin-block: var(--aisd-space-sm) var(--aisd-space-md);
    max-inline-size: 56ch;
    color: var(--aisd-ink-muted);
    font-size: var(--aisd-step-1);
    line-height: var(--aisd-line-relaxed);
}

.aisd-s-hero-stats__figures {
    margin-block-start: var(--aisd-space-xl);
    padding-block-start: var(--aisd-space-lg);
    box-shadow: inset 0 1px 0 var(--aisd-border);
}

/* ── section: testimonials (library/sections/marketing/testimonials) ── */
/* testimonials — scoped .aisd-s-testimonials · tokens only. Budget: 100. */

.aisd-s-testimonials {
    padding-block: var(--aisd-space-section);
    background: var(--aisd-surface-1);
}

.aisd-s-testimonials__head {
    max-inline-size: 46rem;
    margin-block-end: var(--aisd-space-lg);
}

.aisd-s-testimonials__eyebrow {
    margin-block-end: var(--aisd-space-2xs);
    color: var(--aisd-brand-text);
    font-size: var(--aisd-step--1);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.aisd-s-testimonials__title {
    color: var(--aisd-ink);
    text-wrap: balance;
}

.aisd-s-testimonials__grid {
    display: grid;
    gap: var(--aisd-space-md);
}

@media (min-width: 768px) {
    .aisd-s-testimonials--grid .aisd-s-testimonials__grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .aisd-s-testimonials--featured .aisd-s-testimonials__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.aisd-s-testimonials__card {
    display: flex;
    flex-direction: column;
    gap: var(--aisd-space-sm);
    margin: 0;
    padding: var(--aisd-space-md);
    border-radius: var(--aisd-radius-lg);
    background: var(--aisd-surface-2);
    box-shadow: var(--aisd-elev-1);
}

.aisd-s-testimonials--featured .aisd-s-testimonials__card {
    padding: var(--aisd-space-lg);
}

.aisd-s-testimonials__quote {
    margin: 0;
}

.aisd-s-testimonials__quote p {
    color: var(--aisd-ink);
    font-size: var(--aisd-step-1);
    line-height: var(--aisd-line-relaxed);
}

.aisd-s-testimonials__author {
    display: flex;
    flex-direction: column;
    margin-block-start: auto;
}

.aisd-s-testimonials__name {
    font-weight: 700;
    color: var(--aisd-ink);
}

.aisd-s-testimonials__role {
    color: var(--aisd-ink-muted);
    font-size: var(--aisd-step--1);
}

/* ── templates: contractual pages ── */
/* aisd templates — page heads, article, cards grid, pagination, breadcrumbs,
   error page. Scoped aisd-t-* · tokens only · logical properties ·
   mobile-first. Bundled into components.css by the assembler. */

.aisd-t-page-head {
    padding-block: var(--aisd-space-xl);
}

.aisd-t-page-head__eyebrow {
    margin-block-end: var(--aisd-space-2xs);
    color: var(--aisd-brand-text);
    font-size: var(--aisd-step--1);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.aisd-t-page-head__title {
    color: var(--aisd-ink);
    font-size: var(--aisd-step-4);
    text-wrap: balance;
}

.aisd-t-breadcrumbs {
    margin-block-end: var(--aisd-space-sm);
    font-size: var(--aisd-step--1);
}

.aisd-t-breadcrumbs ol {
    display: flex;
    flex-wrap: wrap;
    gap: var(--aisd-space-3xs);
    margin: 0;
    padding: 0;
    list-style: none;
}

.aisd-t-breadcrumbs li + li::before {
    content: "/";
    margin-inline-end: var(--aisd-space-3xs);
    color: var(--aisd-ink-muted);
}

.aisd-t-breadcrumbs a {
    color: var(--aisd-ink-muted);
    text-decoration: none;
}

.aisd-t-breadcrumbs a:hover {
    color: var(--aisd-brand-text);
}

.aisd-t-breadcrumbs span[aria-current] {
    color: var(--aisd-ink);
}

.aisd-t-card-grid {
    display: grid;
    gap: var(--aisd-space-md);
}

@media (min-width: 768px) {
    .aisd-t-card-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.aisd-t-card-article {
    display: flex;
    flex-direction: column;
    border-radius: var(--aisd-radius-lg);
    background: var(--aisd-surface-2);
    box-shadow: var(--aisd-elev-1);
    overflow: hidden;
}

.aisd-t-card-article__media {
    display: block;
    aspect-ratio: 16 / 9;
    background: var(--aisd-surface-3);
}

.aisd-t-card-article__media img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
}

.aisd-t-card-article__placeholder {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    background: var(--aisd-gradient-brand);
    opacity: 0.75;
}

.aisd-t-card-article__body {
    display: flex;
    flex-direction: column;
    gap: var(--aisd-space-2xs);
    padding: var(--aisd-space-md);
}

.aisd-t-card-article__title a {
    color: var(--aisd-ink);
    text-decoration: none;
}

.aisd-t-card-article__title a:hover {
    color: var(--aisd-brand-text);
}

.aisd-t-card-article__excerpt {
    color: var(--aisd-ink-muted);
    line-height: var(--aisd-line-relaxed);
}

.aisd-t-card-article__date {
    margin-block-start: auto;
    color: var(--aisd-ink-muted);
    font-size: var(--aisd-step--1);
}

.aisd-t-article__head {
    margin-block-end: var(--aisd-space-lg);
}

.aisd-t-article__title {
    color: var(--aisd-ink);
    font-size: var(--aisd-step-4);
    text-wrap: balance;
}

.aisd-t-article__meta {
    margin-block-start: var(--aisd-space-xs);
    color: var(--aisd-ink-muted);
    font-size: var(--aisd-step--1);
}

.aisd-t-article__cover {
    margin-block-end: var(--aisd-space-lg);
    border-radius: var(--aisd-radius-lg);
    overflow: hidden;
    box-shadow: var(--aisd-elev-2);
}

.aisd-t-article__content {
    color: var(--aisd-ink);
}

.aisd-t-related__title {
    margin-block-end: var(--aisd-space-lg);
    color: var(--aisd-ink);
}

.aisd-t-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--aisd-space-3xs);
    margin-block-start: var(--aisd-space-xl);
}

.aisd-t-pagination a,
.aisd-t-pagination__current {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-inline-size: 2.75rem;
    min-block-size: 2.75rem;
    border-radius: var(--aisd-radius-md);
    color: var(--aisd-ink);
    text-decoration: none;
}

.aisd-t-pagination a:hover {
    background: var(--aisd-surface-2);
    color: var(--aisd-brand-text);
}

.aisd-t-pagination__current {
    background: var(--aisd-brand);
    color: var(--aisd-on-brand);
    font-weight: 700;
}

.aisd-t-pagination__dots {
    color: var(--aisd-ink-muted);
}

.aisd-t-empty {
    padding-block: var(--aisd-space-xl);
    color: var(--aisd-ink-muted);
    text-align: center;
}

.aisd-t-error__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--aisd-space-sm);
    padding-block: var(--aisd-space-3xl);
    text-align: center;
}

.aisd-t-error__code {
    font-family: var(--aisd-font-heading);
    font-size: var(--aisd-step-5);
    font-weight: 700;
    background: var(--aisd-gradient-text);
    -webkit-background-clip: text;
    background-clip: text;
    color: var(--aisd-brand-text);
    -webkit-text-fill-color: transparent;
}

.aisd-t-error__title {
    color: var(--aisd-ink);
}

.aisd-t-error__body {
    max-inline-size: 45ch;
    color: var(--aisd-ink-muted);
}

.aisd-t-error__link {
    display: inline-flex;
    align-items: center;
    min-block-size: 2.75rem;
    padding-inline: var(--aisd-space-md);
    border-radius: var(--aisd-radius-button);
    background: var(--aisd-brand);
    color: var(--aisd-on-brand);
    font-weight: 600;
    text-decoration: none;
}