*{box-sizing:border-box}:root{--color-bg:#f4f7fb;--color-bg-subtle:#f8fafc;--color-bg-muted:#f5f5f5;--color-surface:#fff;--color-on-accent:#fff;--color-on-accent-hover:#fff;--color-border:#e5e7eb;--color-border-strong:#d1d5db;--color-text:#111827;--color-muted:#6b7280;--color-accent:#3498db;--color-accent-hover:#2980b9;--color-accent-ring:#3498db26;--color-shadow-rgb:17 24 39}@media (prefers-color-scheme:dark){:root{--color-bg:#111827;--color-bg-subtle:#0f1520;--color-bg-muted:#1a2230;--color-surface:#1f2937;--color-on-accent-hover:#111827;--color-border:#374151;--color-border-strong:#4b5563;--color-text:#e5e7eb;--color-muted:#9ca3af;--color-accent-hover:#5dade2;--color-accent-ring:#3498db4d;--color-shadow-rgb:0 0 0}}html{scroll-padding-top:24px}body{background:var(--color-bg-subtle);color:var(--color-text);letter-spacing:0;margin:0;font:1rem/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}h1,h2,h3,p{margin:0}h1,h2,h3{overflow-wrap:anywhere;font-weight:600;line-height:1.25}a{color:inherit;text-underline-offset:4px}a:focus-visible{outline:2px solid var(--color-accent-hover);outline-offset:4px;box-shadow:0 0 0 3px var(--color-accent-ring)}.container{width:min(1200px,100% - 48px);margin-inline:auto}.skipLink{z-index:5;background:var(--color-surface);padding:8px 16px;position:fixed;top:8px;left:8px;transform:translateY(-160%)}.skipLink:focus{transform:none}.siteHeader{background:var(--color-surface);border-bottom:1px solid var(--color-border)}.headerContent{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 32px;min-height:64px;padding:8px 24px;display:flex}.brand{align-items:center;gap:12px;font-size:1.5rem;font-weight:600;text-decoration:none;display:inline-flex}.brandIcon{fill:none;width:28px;height:28px;stroke:var(--color-accent);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;flex:none}.headerNav,.heroActions,.footerNav{flex-wrap:wrap;justify-content:center;align-items:center;gap:24px;display:flex}.navLink,.footerLink{color:var(--color-muted);font-size:.875rem;text-decoration:none}.navLink:hover,.footerLink:hover{color:var(--color-text);text-decoration:underline}.primaryButton,.secondaryButton{text-align:center;overflow-wrap:anywhere;border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;min-height:44px;padding:10px 24px;font-size:1.1875rem;font-weight:700;line-height:1.4;text-decoration:none;display:inline-flex}.primaryButton{background:var(--color-accent);color:var(--color-on-accent)}.primaryButton:hover{background:var(--color-accent-hover);color:var(--color-on-accent-hover)}.secondaryButton{background:var(--color-surface);color:var(--color-text);border-color:var(--color-border)}.secondaryButton:hover{background:var(--color-bg-muted);border-color:var(--color-border-strong)}.hero{background:var(--color-bg-subtle);border-bottom:1px solid var(--color-border)}.heroContent{text-align:center;padding-block:36px 28px}.heroTitle{font-size:2.75rem}.heroAudience{color:var(--color-text);overflow-wrap:anywhere;margin-top:12px;font-size:1.375rem}.heroDescription{max-width:680px;color:var(--color-muted);margin:12px auto 0;font-size:1rem}.heroActions{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),260px));grid-auto-rows:1fr;align-items:stretch;gap:16px;margin-top:24px;display:grid}.heroAction{width:260px;max-width:100%}.heroAction,.heroAction:hover{background-clip:padding-box}.workspacePreview{width:min(1200px,100% - 48px);margin-inline:auto;display:block}.workspaceImage{object-fit:contain;object-position:center bottom;width:100%;height:auto;max-height:clamp(120px,100svh - 430px,500px);display:block}.section{padding-block:64px;scroll-margin-top:24px}.sectionTitle{text-align:center;font-size:2rem}.featureGrid{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));grid-auto-rows:1fr;gap:56px 32px;margin-top:64px;display:grid}.featureCard{background:var(--color-surface);border:1px solid var(--color-border);min-width:0;min-height:220px;box-shadow:0 10px 25px -5px rgb(var(--color-shadow-rgb) / 6%);text-align:center;border-radius:8px;flex-direction:column;justify-content:center;padding:40px 24px;display:flex;position:relative}.featureIcon{background:var(--color-bg);border:1px solid var(--color-border);width:50px;height:50px;color:var(--color-accent);border-radius:8px;place-items:center;display:grid;position:absolute;top:-25px;left:calc(50% - 25px)}.featureSymbol{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:28px;height:28px}.featureTitle{font-size:1.25rem}.featureDescription{color:var(--color-muted);margin-top:12px;line-height:1.6}@media (hover:hover) and (pointer:fine){.featureCard:hover{border-color:var(--color-border-strong);box-shadow:0 12px 28px -6px rgb(var(--color-shadow-rgb) / 12%)}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.featureCard{transition:transform .15s,box-shadow .15s,border-color .15s}.featureCard:hover{transform:translateY(-3px)}.featureCard:hover:after{content:"";height:4px;position:absolute;bottom:-4px;left:-1px;right:-1px}}.siteFooter{background:var(--color-bg-subtle);padding-block:36px}.footerContent{justify-content:space-between;align-items:center;gap:32px;display:flex}.footerDescription{color:var(--color-muted);margin-top:8px;font-size:.875rem}@media (width<=900px){.headerNav{gap:16px}.featureGrid{row-gap:48px}.featureCard{padding-inline:20px}.footerContent{flex-direction:column;align-items:flex-start}}@media (width<=700px){.container,.workspacePreview{width:calc(100% - 32px)}.headerContent{gap:12px;padding-inline:16px}.brand{gap:8px;font-size:1.25rem}.navLink{display:none}.primaryButton,.secondaryButton{padding-inline:16px}.heroContent{padding-block:20px}.heroTitle{font-size:2rem}.heroAudience{font-size:1.125rem}.heroActions{gap:12px}.section{padding-block:40px}.sectionTitle{font-size:1.625rem}.featureGrid{margin-top:52px}.featureCard{padding-inline:24px}.footerNav{justify-content:flex-start;gap:16px 24px}}@media (width<=400px) and (height<=650px){.heroContent{padding-block:12px}.heroTitle{font-size:1.75rem}.heroActions{margin-top:16px}.workspaceImage{max-height:120px}}@media (height<=500px) and (width>700px){.heroContent{padding-block:12px}.heroTitle{font-size:1.75rem}.heroAudience{margin-top:8px;font-size:1rem}.heroDescription{display:none}.heroActions{margin-top:12px}.workspaceImage{max-height:100px}.section{padding-block:24px}}
