@layer components{.article-layout{--article-layout-content-max-width: 42rem;--article-layout-wide-max-width: 56rem;--article-layout-prose-lh: var(--line-height-relaxed);--article-layout-heading-lh: var(--line-height-snug);--article-layout-blockquote-border-width: 3px;width:100%;max-width:calc(var(--layout-content-max-width) + var(--spacing-4) * 2);margin-inline:auto;padding-block:var(--spacing-8);padding-inline:var(--spacing-4)}@media(min-width:600px){.article-layout{padding-block:var(--spacing-16)}}@media(min-width:750px){.article-layout{padding-inline:var(--spacing-16)}}@media(min-width:1350px){.article-layout{padding-inline:var(--spacing-4)}}.article-layout__back-link{display:inline-flex;align-items:center;gap:var(--spacing-2);margin-block-end:var(--spacing-6);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-subdued);text-decoration:none;transition:color var(--transition-fast)}.article-layout__back-link:hover{color:var(--color-text);text-decoration:none}.article-layout__header{margin-block-end:var(--spacing-8)}.article-layout__category{display:inline-flex;padding:var(--spacing-1) var(--spacing-3);border-radius:var(--radius-full);background-color:var(--color-surface-offset);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-subdued);text-transform:capitalize;margin-block-end:var(--spacing-4)}.article-layout__title{max-width:var(--article-layout-wide-max-width);font-size:clamp(var(--font-size-2xl),4vw,var(--font-size-4xl));font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-normal);text-wrap:balance;margin-block-end:var(--spacing-4)}.article-layout__byline{display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-2);font-size:var(--font-size-sm);color:var(--color-text-subdued)}.article-layout__author{font-weight:var(--font-weight-medium);color:var(--color-text)}.article-layout__separator{color:var(--color-border)}.article-layout__content{max-width:var(--article-layout-content-max-width)}.article-layout__content h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-medium);line-height:var(--article-layout-heading-lh);margin-block:var(--spacing-8) var(--spacing-4)}.article-layout__content h3{font-size:var(--font-size-xl);font-weight:var(--font-weight-medium);line-height:var(--article-layout-heading-lh);margin-block:var(--spacing-6) var(--spacing-3)}.article-layout__content p{font-size:var(--font-size-md);line-height:var(--article-layout-prose-lh);color:var(--color-text-subdued);margin-block-end:var(--spacing-4)}@media(min-width:600px){.article-layout__content p{font-size:var(--font-size-lg)}}.article-layout__content p:first-child{font-size:var(--font-size-lg);color:var(--color-text)}@media(min-width:600px){.article-layout__content p:first-child{font-size:var(--font-size-xl)}}.article-layout__content ul,.article-layout__content ol{padding-inline-start:var(--spacing-6);margin-block-end:var(--spacing-4)}.article-layout__content ul{list-style:disc}.article-layout__content ol{list-style:decimal}.article-layout__content li{list-style:inherit;font-size:var(--font-size-md);line-height:var(--article-layout-prose-lh);color:var(--color-text-subdued);margin-block-end:var(--spacing-2)}@media(min-width:600px){.article-layout__content li{font-size:var(--font-size-lg)}}.article-layout__content blockquote{border-inline-start:var(--article-layout-blockquote-border-width) solid var(--color-border-strong);padding-inline-start:var(--spacing-4);margin-inline:0;margin-block:var(--spacing-4);color:var(--color-text-subdued);font-style:normal}.article-layout__content a{color:var(--color-accent-strong);text-decoration:underline;text-underline-offset:var(--spacing-1)}.article-layout__content a:hover{color:var(--color-accent)}.article-callout{padding:var(--spacing-6);margin-block:var(--spacing-6);border-radius:var(--radius-2xl);background-color:var(--color-surface-offset);border-inline-start:4px solid var(--color-accent-strong)}.article-callout p{font-size:var(--font-size-md);line-height:var(--article-layout-prose-lh);color:var(--color-text)}.article-callout p:last-child{margin-block-end:0}.article-image{margin-block:var(--spacing-6)}.article-image__img{width:100%;height:auto;border-radius:var(--radius-xl);border:1px solid var(--color-border)}.article-image__caption{margin-block-start:var(--spacing-2);font-size:var(--font-size-sm);color:var(--color-text-subdued);text-align:center}}