:root{--orange-500: #ff6a00;--orange-400: #ff8a3d;--orange-300: #ffb27a;--ink-900: #0f1115;--ink-700: #1c1f26;--ink-500: #4a4f5a;--ink-300: #8a909c;--surface: #ffffff;--surface-soft: #f6f7f9;--border: #e8eaee;--radius: 18px;--radius-sm: 12px;--shadow-sm: 0 1px 2px rgba(15, 17, 21, .04), 0 4px 16px rgba(15, 17, 21, .05);--shadow-md: 0 12px 40px rgba(15, 17, 21, .1);--maxw: 1120px;--font: "Helvetica Neue", Helvetica, Arial, "Segoe UI", Roboto, sans-serif}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--font);color:var(--ink-900);background:var(--surface);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 24px}a{color:inherit;text-decoration:none}.site-header{position:sticky;top:0;z-index:50;background:#ffffffc7;-webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--border)}.header-inner{display:flex;align-items:center;justify-content:space-between;height:68px}.brand{display:inline-flex;align-items:center;gap:10px;font-weight:700;letter-spacing:-.01em}.brand-logo{width:36px;height:36px;border-radius:8px;object-fit:contain;display:block}.brand-name{font-size:1.15rem}.brand-accent{color:var(--orange-500)}.hero{position:relative;overflow:hidden;display:flex;align-items:center;min-height:calc(100vh - 68px);padding:110px 0 96px;text-align:center}.hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background-image:linear-gradient(180deg,#0f1115b8,#0f11158c 45%,#0f1115b8),url(/hero-bg.jpg);background-size:cover;background-position:center;background-repeat:no-repeat}.hero-inner{position:relative;z-index:2;width:100%;max-width:940px;margin:0 auto}.eyebrow{display:inline-block;margin:0 0 18px;padding:6px 14px;border-radius:999px;background:#ff6a001a;color:var(--orange-500);font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}.hero-title{margin:0 0 20px;font-size:clamp(2.4rem,6vw,4rem);line-height:1.05;font-weight:700;letter-spacing:-.03em;color:#fff}.gradient-text{background:linear-gradient(120deg,var(--orange-500),var(--orange-300));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}.hero-sub{margin:0 auto 34px;max-width:540px;font-size:1.12rem;color:#ffffffc7}.hero-glow{position:absolute;top:-160px;left:50%;transform:translate(-50%);width:760px;height:760px;background:radial-gradient(circle,rgba(255,138,61,.22),transparent 62%);z-index:1;pointer-events:none}.app-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;max-width:840px;margin:8px auto 0}.app-card{position:relative;display:flex;flex-direction:column;gap:18px;padding:30px;text-align:left;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.app-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--orange-300)}.app-card:focus-visible{outline:3px solid var(--orange-400);outline-offset:3px}.app-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:14px;color:#fff}.app-icon--assets{background:linear-gradient(135deg,#ff8a3d,#ff6a00)}.app-icon--payroll{background:linear-gradient(135deg,#1c1f26,#3a3f4b)}.app-body{flex:1}.app-name{margin:0 0 8px;font-size:1.3rem;font-weight:700;letter-spacing:-.01em}.app-desc{margin:0;color:var(--ink-500);font-size:.98rem}.app-link{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--orange-500)}.app-link svg{transition:transform .18s ease}.app-card:hover .app-link svg{transform:translate(4px)}.site-footer{padding:36px 0;background:var(--ink-900);color:#fff}.footer-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}.footer-brand{font-size:1.05rem;font-weight:700}.footer-copy{margin:0;color:var(--ink-300);font-size:.9rem}@media (max-width: 640px){.hero{padding:80px 0 64px}}
