*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--font: "DM Sans", system-ui, sans-serif;--bg: #1a1a1a;--surface: #1f1f1f;--surface-hover: #262626;--border: #2c2c2c;--text-1: #cccccc;--text-2: #858585;--text-3: #555555;--radius: 14px}body{font-family:var(--font);background:var(--bg);color:var(--text-1);min-height:100vh;-webkit-font-smoothing:antialiased;overflow-x:hidden}.bg-grain{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:200px}.bg-gradient{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse 80% 50% at 50% -10%,rgba(107,143,163,.08) 0%,transparent 60%),radial-gradient(ellipse 60% 40% at 70% 90%,rgba(107,191,170,.04) 0%,transparent 50%)}.page{position:relative;z-index:1;max-width:760px;margin:0 auto;padding:0 1.5rem;min-height:100vh;display:flex;flex-direction:column}.hero{padding:8rem 0 0;opacity:0;transform:translateY(16px);animation:rise-in .7s cubic-bezier(.16,1,.3,1) .1s forwards}.hero__eyebrow{font-size:.7rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin-bottom:1.5rem}.hero__title{font-size:clamp(2rem,5vw,3rem);font-weight:700;line-height:1.15;letter-spacing:-.035em;color:var(--text-1);margin-bottom:1.25rem}.hero__title-em{background:linear-gradient(135deg,#6b8fa3,#6bbfaa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero__sub{font-size:1rem;font-weight:400;line-height:1.6;color:var(--text-2);max-width:420px}.hero__line{width:48px;height:1px;background:linear-gradient(90deg,var(--border),transparent);margin-top:2.5rem}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;padding:3rem 0 4rem}.card{position:relative;display:block;text-decoration:none;color:inherit;border-radius:var(--radius);cursor:pointer;opacity:0;transform:translateY(20px);animation:rise-in .6s cubic-bezier(.16,1,.3,1) var(--delay) forwards;transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1)}.card--disabled{cursor:default}.card--disabled .card__inner{opacity:.5}.card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius);padding:1px;background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 30%,transparent) 0%,var(--border) 40%,var(--border) 60%,color-mix(in srgb,var(--accent) 15%,transparent) 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;transition:opacity .3s ease}.card__glow{position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:var(--radius);background:radial-gradient(ellipse 70% 60% at 30% 20%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 70%);opacity:0;transition:opacity .4s ease;pointer-events:none}a.card:hover .card__glow{opacity:1}a.card:hover{transform:translateY(-4px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .25s cubic-bezier(.16,1,.3,1)}a.card:hover:before{background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 50%,transparent) 0%,var(--border) 35%,var(--border) 65%,color-mix(in srgb,var(--accent) 30%,transparent) 100%)}.card__inner{position:relative;z-index:1;background:var(--surface);border-radius:var(--radius);padding:1.75rem 1.5rem 1.5rem;height:100%;display:flex;flex-direction:column;transition:background .3s ease;overflow:hidden}a.card:hover .card__inner{background:var(--surface-hover)}.card__header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:1.75rem}.card__icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:color-mix(in srgb,var(--accent) 10%,var(--bg));color:var(--accent);flex-shrink:0}.card__arrow{color:var(--text-3);margin-top:4px;transition:color .2s ease,transform .2s ease}a.card:hover .card__arrow{color:var(--accent);transform:translate(2px,-2px)}.card__badge{font-size:.6rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);padding:.25rem .6rem;border-radius:6px;border:1px solid var(--border);white-space:nowrap;margin-top:4px}.card__body{flex:1}.card__title{font-size:1rem;font-weight:600;letter-spacing:-.01em;color:var(--text-1);margin-bottom:.5rem;line-height:1.3}.card__desc{font-size:.8rem;font-weight:400;line-height:1.6;color:var(--text-2)}.card__accent-line{position:absolute;bottom:0;left:1.5rem;right:1.5rem;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:0;transition:opacity .4s ease}a.card:hover .card__accent-line{opacity:.3}.footer{margin-top:auto;padding:2rem 0 3rem;display:flex;align-items:center;gap:.5rem;font-size:.7rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);opacity:0;animation:fade-in 1s ease 1.2s forwards}.footer__dot{width:5px;height:5px;border-radius:50%;background:#6bbfaa;opacity:.6}@keyframes rise-in{to{opacity:1;transform:translateY(0)}}@keyframes fade-in{to{opacity:1}}@media(max-width:600px){.hero{padding-top:5rem}.cards{grid-template-columns:1fr;padding:2rem 0 3rem}.card__inner{padding:1.5rem 1.25rem 1.25rem}.card__header{margin-bottom:1.25rem}}
