.of-hero:where(.astro-bbe6dxrz){position:relative;isolation:isolate;width:min(72rem,calc(100vw - 2rem));margin-inline:calc(50% - min(36rem,calc(50vw - 1rem)));padding:clamp(2.5rem,6vw,5rem) var(--sl-content-pad-x, 1.5rem) clamp(3rem,7vw,6rem);overflow:hidden}.of-hero__bg:where(.astro-bbe6dxrz){position:absolute;inset:-1px;z-index:-1;background:radial-gradient(ellipse 60% 60% at 80% 0%,color-mix(in srgb,var(--sl-color-accent) 22%,transparent) 0%,transparent 60%),radial-gradient(ellipse 50% 60% at 20% 100%,color-mix(in srgb,var(--sl-color-accent) 12%,transparent) 0%,transparent 60%),linear-gradient(180deg,transparent,var(--sl-color-bg) 100%)}.of-hero__bg:where(.astro-bbe6dxrz):after{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--sl-color-hairline-light) 1px,transparent 1px),linear-gradient(90deg,var(--sl-color-hairline-light) 1px,transparent 1px);background-size:28px 28px;mask-image:radial-gradient(ellipse 70% 60% at 50% 0%,black,transparent 80%);-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 0%,black,transparent 80%);opacity:.6}.of-hero__inner:where(.astro-bbe6dxrz){display:grid;gap:clamp(2rem,4vw,3rem);grid-template-columns:1fr;align-items:center;max-width:68rem;margin:0 auto}@media(min-width:60rem){.of-hero__inner:where(.astro-bbe6dxrz){grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}}.of-hero__copy:where(.astro-bbe6dxrz){display:flex;flex-direction:column;gap:1rem}.of-hero__eyebrow:where(.astro-bbe6dxrz){display:inline-flex;align-items:center;gap:.4rem;font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--sl-color-text-accent);width:fit-content;padding:.3rem .65rem;border-radius:999px;background:var(--sl-color-accent-low);border:1px solid color-mix(in srgb,var(--sl-color-accent) 25%,transparent)}.of-hero__title:where(.astro-bbe6dxrz){font-size:clamp(2.25rem,5vw,3.6rem);line-height:1.05;letter-spacing:-.035em;font-weight:700;margin:0;color:var(--sl-color-gray-1)}.of-hero__tagline:where(.astro-bbe6dxrz){font-size:clamp(1rem,1.5vw,1.15rem);line-height:1.55;color:var(--sl-color-gray-3);max-width:36rem;margin:0}.of-hero__actions:where(.astro-bbe6dxrz){display:flex;flex-wrap:wrap;gap:.625rem;margin-top:.5rem}.of-hero__btn:where(.astro-bbe6dxrz){display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1rem;border-radius:.5rem;font-size:.875rem;font-weight:600;text-decoration:none;transition:background-color .12s ease,border-color .12s ease,transform .12s ease;line-height:1}.of-hero__btn--primary:where(.astro-bbe6dxrz){background:var(--sl-color-text);color:var(--sl-color-text-invert);border:1px solid var(--sl-color-text);box-shadow:0 1px #0000000d,0 1px 2px #0000000a}.of-hero__btn--primary:where(.astro-bbe6dxrz):hover{background:var(--sl-color-gray-2);border-color:var(--sl-color-gray-2)}.of-hero__btn--minimal:where(.astro-bbe6dxrz){background:transparent;color:var(--sl-color-text);border:1px solid var(--sl-color-hairline-shade)}.of-hero__btn--minimal:where(.astro-bbe6dxrz):hover{background:var(--sl-color-hairline-light)}.of-hero__demo:where(.astro-bbe6dxrz){position:relative}.of-hero__demo-frame:where(.astro-bbe6dxrz){border-radius:.75rem;overflow:hidden;border:1px solid var(--sl-color-hairline-shade);background:var(--of-surface-elevated);box-shadow:0 1px #ffffff0a inset,0 24px 48px -16px #0f172a2e,0 12px 24px -12px #0f172a1f}.of-hero__demo-chrome:where(.astro-bbe6dxrz){display:flex;align-items:center;gap:.4rem;padding:.5rem .75rem;background:var(--sl-color-hairline-light);border-bottom:1px solid var(--sl-color-hairline)}.of-hero__demo-dot:where(.astro-bbe6dxrz){width:.5rem;height:.5rem;border-radius:999px;background:var(--sl-color-hairline-shade)}.of-hero__demo-name:where(.astro-bbe6dxrz){margin-inline-start:auto;font-family:var(--sl-font-mono);font-size:.7rem;color:var(--sl-color-gray-4)}.of-hero__demo-frame:where(.astro-bbe6dxrz) .expressive-code{margin:0}.of-hero__demo-frame:where(.astro-bbe6dxrz) .expressive-code .frame{border:none!important;border-radius:0!important}.of-hero__demo-frame:where(.astro-bbe6dxrz) .expressive-code .frame .header{display:none}.of-grid:where(.astro-p7n436wq){display:grid;gap:.875rem;grid-template-columns:1fr;width:min(72rem,calc(100vw - 2rem));margin-inline:calc(50% - min(36rem,calc(50vw - 1rem)));margin-block:2rem}@media(min-width:50rem){.of-grid:where(.astro-p7n436wq){grid-template-columns:repeat(3,1fr)}}.of-grid__card:where(.astro-p7n436wq){position:relative;display:flex;flex-direction:column;gap:.5rem;padding:1.125rem 1.25rem 1.25rem;border-radius:.625rem;border:1px solid var(--sl-color-hairline);background:var(--of-surface-elevated);text-decoration:none;color:inherit;transition:border-color .14s ease,transform .14s ease,box-shadow .14s ease,background-color .14s ease}.of-grid__card:where(.astro-p7n436wq):hover{border-color:color-mix(in srgb,var(--sl-color-accent) 35%,var(--sl-color-hairline-shade));transform:translateY(-1px);box-shadow:0 6px 20px -10px #0f172a1f}.of-grid__head:where(.astro-p7n436wq){display:flex;align-items:center;justify-content:space-between;gap:.5rem}.of-grid__title:where(.astro-p7n436wq){margin:0;font-size:.95rem;font-weight:650;letter-spacing:-.012em;color:var(--sl-color-gray-1)}.of-grid__badge:where(.astro-p7n436wq){font-size:.65rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:.15rem .4rem;border-radius:999px;color:var(--sl-color-text-accent);background:var(--sl-color-accent-low);border:1px solid color-mix(in srgb,var(--sl-color-accent) 25%,transparent)}.of-grid__desc:where(.astro-p7n436wq){margin:0;font-size:.85rem;line-height:1.55;color:var(--sl-color-gray-3)}.of-grid__arrow:where(.astro-p7n436wq){position:absolute;top:1.125rem;right:1rem;color:var(--sl-color-gray-5);transition:color .14s ease,transform .14s ease}.of-grid__card:where(.astro-p7n436wq):hover .of-grid__arrow:where(.astro-p7n436wq){color:var(--sl-color-text-accent);transform:translate(2px)}