.public-hero{--public-accent:var(--primary);--public-accent-soft:color-mix(in oklch, var(--primary) 55%, transparent);background:radial-gradient(ellipse 140% 90% at 15% -20%, color-mix(in oklch, var(--public-accent) 38%, transparent) 0%, color-mix(in oklch, var(--public-accent) 12%, transparent) 42%, transparent 72%), radial-gradient(ellipse 90% 70% at 88% 80%, color-mix(in oklch, var(--public-accent) 14%, transparent) 0%, transparent 58%), linear-gradient(165deg, color-mix(in oklch, var(--background) 92%, var(--public-accent) 8%) 0%, var(--background) 55%);position:relative}.public-hero[data-accent=sky]{--public-accent:#43b2e1}@supports (color:lab(0% 0 0)){.public-hero[data-accent=sky]{--public-accent:lab(67.7933% -21.1468 -33.539)}}.public-hero[data-accent=amber]{--public-accent:#e0af3b}@supports (color:lab(0% 0 0)){.public-hero[data-accent=amber]{--public-accent:lab(74.6768% 10.2723 63.231)}}.public-hero[data-accent=rose]{--public-accent:#e68485}@supports (color:lab(0% 0 0)){.public-hero[data-accent=rose]{--public-accent:lab(66.2826% 38.3043 16.8566)}}.public-hero[data-accent=olive]{--public-accent:var(--primary)}.dark .public-hero{background:radial-gradient(ellipse 140% 90% at 15% -20%, color-mix(in oklch, var(--public-accent) 42%, transparent) 0%, color-mix(in oklch, var(--public-accent) 16%, transparent) 42%, transparent 72%), radial-gradient(ellipse 90% 70% at 88% 80%, color-mix(in oklch, var(--public-accent) 18%, transparent) 0%, transparent 58%), linear-gradient(165deg, color-mix(in oklch, var(--background) 88%, var(--public-accent) 12%) 0%, var(--background) 55%)}.public-hero-grid{opacity:.45;background-image:linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px);pointer-events:none;background-size:48px 48px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(75% 70% at 50% 40%,#000 15%,#0000 75%);mask-image:radial-gradient(75% 70% at 50% 40%,#000 15%,#0000 75%)}.dark .public-hero-grid{opacity:.3}.public-hero-motif{color:var(--public-accent);opacity:.09;pointer-events:none;-webkit-user-select:none;user-select:none;position:absolute}.dark .public-hero-motif{opacity:.14}.public-hero-motif-1{width:11rem;height:11rem;animation:12s ease-in-out infinite public-hero-float;top:12%;right:6%;transform:rotate(12deg)}.public-hero-motif-2{width:7rem;height:7rem;animation:14s ease-in-out .8s infinite reverse public-hero-float;bottom:8%;right:22%;transform:rotate(-18deg)}.public-hero-motif-3{opacity:.06;width:5rem;height:5rem;animation:16s ease-in-out 1.2s infinite public-hero-float;top:28%;right:32%;transform:rotate(8deg)}.public-hero-motif-4{opacity:.07;width:6.5rem;height:6.5rem;animation:13s ease-in-out .4s infinite reverse public-hero-float;bottom:18%;left:8%;transform:rotate(-8deg)}.public-hero[data-variant=quiet] .public-hero-motif{opacity:.05}.dark .public-hero[data-variant=quiet] .public-hero-motif{opacity:.08}.public-hero-badge{animation:.7s ease-out both public-hero-in}.public-hero-copy{animation:.75s ease-out 80ms both public-hero-in}@keyframes public-hero-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes public-hero-float{0%,to{transform:translateY(0) rotate(var(--motif-rotate,12deg))}50%{transform:translateY(-10px) rotate(var(--motif-rotate,12deg))}}.public-content{position:relative}.public-content-glow{pointer-events:none;background:radial-gradient(ellipse 70% 40% at 50% 0%, color-mix(in oklch, var(--primary) 8%, transparent) 0%, transparent 70%), radial-gradient(ellipse 40% 30% at 100% 40%, color-mix(in oklch, var(--chart-2,var(--primary)) 6%, transparent) 0%, transparent 60%);position:absolute;inset:0}.public-content[data-quiet=true] .public-content-glow{opacity:.5}.public-section{padding-left:1rem;position:relative}@media (min-width:768px){.public-section{padding-left:1.25rem}}.public-section-rail{background:linear-gradient(to bottom, var(--primary), color-mix(in oklch, var(--primary) 20%, transparent));border-radius:999px;width:3px;position:absolute;top:.35rem;bottom:.35rem;left:0}.public-feature-item{background:linear-gradient(135deg, color-mix(in oklch, var(--primary) 8%, transparent) 0%, transparent 55%), color-mix(in oklch, var(--muted) 55%, transparent);border:1px solid color-mix(in oklch, var(--border) 80%, transparent);border-radius:1rem;padding:1.25rem 1.25rem 1.25rem 1.15rem;position:relative}.public-callout{border:1px solid color-mix(in oklch, var(--primary) 25%, var(--border));background:linear-gradient(120deg, color-mix(in oklch, var(--primary) 12%, transparent) 0%, color-mix(in oklch, var(--background) 90%, transparent) 55%);border-radius:1rem;padding:1.25rem 1.5rem;position:relative;overflow:hidden}.public-callout:before{content:"";background-image:radial-gradient(circle at 100% 0%, color-mix(in oklch, var(--primary) 18%, transparent), transparent 45%);pointer-events:none;position:absolute;inset:0}.public-pricing-card{border:1px solid color-mix(in oklch, var(--border) 85%, transparent);background:linear-gradient(160deg, color-mix(in oklch, var(--primary) 7%, transparent) 0%, transparent 50%), color-mix(in oklch, var(--muted) 45%, transparent);border-radius:1rem;flex-direction:column;padding:1.35rem 1.35rem 1.25rem;transition:border-color .2s,transform .2s,box-shadow .2s;display:flex;position:relative}.public-pricing-card:hover{border-color:color-mix(in oklch, var(--primary) 35%, var(--border));box-shadow:0 12px 28px -20px color-mix(in oklch, var(--foreground) 35%, transparent);transform:translateY(-2px)}.public-pricing-card--featured{border-color:color-mix(in oklch, var(--primary) 40%, var(--border));background:linear-gradient(160deg, color-mix(in oklch, var(--primary) 14%, transparent) 0%, transparent 55%), color-mix(in oklch, var(--card) 80%, transparent);box-shadow:0 10px 30px -18px color-mix(in oklch, var(--primary) 45%, transparent)}.public-doc-link{border:1px solid var(--border);background:color-mix(in oklch, var(--card) 70%, transparent);border-radius:.875rem;align-items:flex-start;gap:.875rem;padding:1rem 1.1rem;transition:border-color .2s,background .2s,transform .2s;display:flex}.public-doc-link:hover{border-color:color-mix(in oklch, var(--primary) 45%, var(--border));background:color-mix(in oklch, var(--primary) 6%, var(--card));transform:translateY(-1px)}
