@layer reset,tokens,base,components,utilities;@layer components{.card{--card-bg: var(--color-bg-elevated);--card-fg: var(--color-text-default);--card-border: var(--color-border-subtle);--card-padding: var(--space-6);--card-radius: var(--radius-lg);--card-shadow: var(--shadow-1);display:grid;gap:var(--space-3);padding:var(--card-padding);background:var(--card-bg);color:var(--card-fg);border:1px solid var(--card-border);border-radius:var(--card-radius);box-shadow:var(--card-shadow);text-decoration:none;transition:transform var(--duration-normal) var(--easing-standard),box-shadow var(--duration-normal) var(--easing-standard),border-color var(--duration-normal) var(--easing-standard)}.card[data-surface=muted]{--card-bg: var(--color-bg-muted);--card-shadow: var(--shadow-0);--card-border: var(--color-border-subtle)}.card[data-surface=inverse]{--card-bg: var(--color-bg-inverse);--card-fg: var(--color-text-inverse);--card-border: transparent}.card[data-elevation="0"]{--card-shadow: var(--shadow-0)}.card[data-elevation="1"]{--card-shadow: var(--shadow-1)}.card[data-elevation="2"]{--card-shadow: var(--shadow-2)}.card[data-elevation="3"]{--card-shadow: var(--shadow-3)}.card[data-padding=sm]{--card-padding: var(--space-4)}.card[data-padding=md]{--card-padding: var(--space-6)}.card[data-padding=lg]{--card-padding: var(--space-7)}.card__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-snug);color:inherit}.card__body{color:var(--color-text-muted);line-height:var(--line-height-normal)}.card[data-surface=inverse] .card__body{color:color-mix(in oklab,var(--color-text-inverse) 80%,transparent)}.card--interactive{cursor:pointer}.card--interactive:hover{transform:translateY(-2px);box-shadow:var(--shadow-3);border-color:var(--color-border-default)}.card--interactive:focus-visible{transform:translateY(-2px);box-shadow:var(--shadow-3)}}@layer components{.blog-card{position:relative}.blog-card__image{margin:0;aspect-ratio:var(--ratio-16-9);background:var(--color-image-placeholder);border-radius:var(--radius-md);overflow:hidden}.blog-card__image img{inline-size:100%;block-size:100%;object-fit:cover}.blog-card__title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);line-height:var(--line-height-snug);text-wrap:balance;margin:0}.blog-card__title a{color:inherit;text-decoration:none}.blog-card__excerpt{color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:var(--line-height-normal)}.blog-card__meta{list-style:none;margin:0;padding:0;display:flex;gap:var(--space-3);font-size:var(--font-size-sm);color:var(--color-text-muted);margin-block-start:auto}.blog-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-3)}.blog-card__link{display:flex;flex-direction:column;gap:var(--space-3);color:inherit;text-decoration:none}.blog-card__body{display:flex;flex-direction:column;gap:var(--space-2);flex:1}.blog-card__date{font-size:var(--font-size-sm);color:var(--color-text-muted)}}@layer components{.blog-card-grid{container-type:inline-size;display:grid;grid-template-columns:repeat(auto-fill,minmax(18rem,1fr));gap:var(--space-5)}}@layer components{.button{--button-bg: var(--color-accent);--button-fg: var(--color-accent-foreground);--button-border: transparent;--button-bg-hover: var(--color-accent-hover);--button-bg-active: var(--color-accent-active);--button-radius: var(--radius-md);--button-px: var(--space-5);--button-py: var(--space-3);--button-font: var(--font-size-md);--button-min-h: 2.75rem;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-block-size:var(--button-min-h);padding-inline:var(--button-px);padding-block:var(--button-py);border-radius:var(--button-radius);border:1px solid var(--button-border);background:var(--button-bg);color:var(--button-fg);font:inherit;font-size:var(--button-font);font-weight:var(--font-weight-medium);line-height:1;text-decoration:none;cursor:pointer;user-select:none;transition:background-color var(--duration-fast) var(--easing-standard),transform var(--duration-fast) var(--easing-standard),box-shadow var(--duration-fast) var(--easing-standard)}.button:hover{background:var(--button-bg-hover)}.button:active{background:var(--button-bg-active);transform:translateY(1px)}.button:disabled,.button[aria-disabled=true]{background:var(--color-button-disabled-bg);color:var(--color-button-disabled-fg);border-color:transparent;cursor:not-allowed;pointer-events:none}.button[data-variant=secondary]{--button-bg: var(--color-secondary);--button-fg: var(--color-secondary-foreground);--button-bg-hover: var(--color-secondary-hover);--button-bg-active: color-mix(in oklab, var(--color-secondary) 75%, #000)}.button[data-variant=ghost]{--button-bg: transparent;--button-fg: var(--color-text-default);--button-border: transparent;--button-bg-hover: var(--color-button-ghost-hover-overlay);--button-bg-active: var(--color-button-ghost-active-overlay)}.button[data-variant=outline]{--button-bg: transparent;--button-fg: var(--color-text-brand);--button-border: var(--color-accent);--button-bg-hover: var(--color-accent-soft);--button-bg-active: color-mix(in oklab, var(--color-accent) 18%, transparent)}.button[data-variant=outline]:hover{color:var(--color-accent-hover);border-color:var(--color-accent-hover)}.button[data-variant=outline]:active{color:var(--color-accent-active)}.section[data-tone=inverse] .button[data-variant=outline],.cta-block[data-variant=inverse] .button[data-variant=outline]{--button-fg: var(--color-text-inverse);--button-border: color-mix(in oklab, var(--color-text-inverse) 60%, transparent);--button-bg-hover: color-mix(in oklab, var(--color-text-inverse) 10%, transparent)}.button[data-variant=gradient]{--button-bg: var(--gradient-brand);--button-fg: #fff;--button-border: transparent;background-image:var(--button-bg);background-size:200% 100%;background-position:0% 0%;transition:background-position var(--duration-normal) var(--easing-standard),transform var(--duration-fast) var(--easing-standard),box-shadow var(--duration-fast) var(--easing-standard)}.button[data-variant=gradient]:hover{background-position:100% 0%}.button[data-variant=gradient]:active{transform:translateY(1px);filter:brightness(.95)}.button[data-variant=gradient]:focus-visible{box-shadow:0 0 0 2px var(--color-bg-default),0 0 0 5px color-mix(in oklab,var(--color-accent) 55%,transparent)}.button[data-size=sm]{--button-px: var(--space-4);--button-py: var(--space-2);--button-font: var(--font-size-sm);--button-min-h: 2.25rem;--button-radius: var(--radius-sm)}.button[data-size=lg]{--button-px: var(--space-6);--button-py: var(--space-4);--button-font: var(--font-size-lg);--button-min-h: 3.25rem}.button--full{inline-size:100%}.button[data-variant=primary]:focus-visible,.button[data-variant=secondary]:focus-visible{box-shadow:0 0 0 2px var(--button-bg),0 0 0 5px color-mix(in oklab,var(--button-bg) 35%,#fff)}.button[data-loading]{pointer-events:none;cursor:progress}.button[data-loading] .button__label{opacity:.6}.button__spinner{inline-size:1em;block-size:1em;border-radius:50%;border:2px solid currentColor;border-inline-start-color:transparent;animation:button-spin .7s linear infinite}@keyframes button-spin{to{transform:rotate(1turn)}}@media(prefers-reduced-motion:reduce){.button__spinner{animation-duration:1.6s}}}.alternatives-grid{display:flex;flex-direction:column;gap:var(--space-5)}.alternatives-grid__actions{display:flex;justify-content:center;margin-block-start:var(--space-5)}@layer reset,tokens,base,components,utilities;@layer components{.hero{container-type:inline-size;padding-block:var(--space-7)}.hero__inner{display:grid;gap:var(--space-7);align-items:center;max-inline-size:var(--content-max-width);margin-inline:auto;padding-inline:var(--padding-inline);inline-size:100%}.hero__content{display:grid;gap:var(--space-5)}.hero__media{margin:0;border-radius:var(--radius-2xl);overflow:hidden;aspect-ratio:var(--ratio-3-2);background:var(--color-hero-soft-bg)}.hero__illustration{inline-size:100%;block-size:100%;object-fit:cover}@container (min-width: 56rem){.hero[data-variant=home] .hero__inner{grid-template-columns:7fr 5fr;max-inline-size:var(--breakout-max-width)}}.hero__eyebrow{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-brand);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;margin:0}.hero__eyebrow--mono,.section__eyebrow--mono{font-family:var(--font-family-mono);font-weight:var(--font-weight-medium)}.hero__title{font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-tight);line-height:var(--line-height-tight);text-wrap:balance;margin:0}.hero__title-accent{background-image:var(--gradient-brand);background-clip:text;color:transparent}.hero__lede{font-size:var(--font-size-lg);color:var(--color-text-muted);line-height:var(--line-height-normal);max-inline-size:36rem}.hero__actions{margin-block-start:var(--space-2)}.hero[data-variant=page] .hero__title{font-size:var(--font-size-3xl)}.hero[data-variant=page] .hero__lede{font-size:var(--font-size-md)}}@layer reset,tokens,base,components,utilities;@layer components{.blog-card-grid{container-type:inline-size;display:grid;grid-template-columns:repeat(auto-fill,minmax(18rem,1fr));gap:var(--space-5)}}
