html,body,#root{margin:0;padding:0;width:100%;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:#0a2f1a}#root{display:flex;flex-direction:column;min-height:100vh}.hero{display:flex;flex-direction:column;align-items:center;text-align:center;padding:3rem 2rem 2rem;background:linear-gradient(135deg,#0d3b1e,#1a6b3c,#2d8f56);color:#fff}.hero h1{font-size:3.5rem;font-weight:800;letter-spacing:-1px;margin-bottom:.5rem}.hero h1 span{color:#7ddf64}.tagline{font-size:1.15rem;font-weight:300;max-width:640px;margin:.5rem auto 1.5rem;opacity:.9}.hexflow-wrapper{width:100%;max-width:700px;margin:0 auto}.canvas-boundary{width:100%;height:450px;border:1px solid rgba(125,223,100,.25);border-radius:12px;overflow:hidden;position:relative;background:#00000026}.canvas-boundary canvas{outline:none!important;touch-action:none}.section{padding:4rem 2rem;max-width:960px;margin:0 auto}.section h2{font-size:2rem;margin-bottom:1rem;color:#e8d580}.section p{font-size:1.1rem;color:#c4b87a;margin-bottom:1.5rem}.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:2rem;margin-top:2rem}.feature{background:#ffffff14;border-radius:12px;padding:2rem;box-shadow:0 2px 12px #00000026;border:1px solid rgba(125,223,100,.2)}.feature h3{color:#b8e6a0;margin-bottom:.5rem;font-size:1.15rem}.feature p{font-size:1rem;color:#c4c4a0}footer{text-align:center;padding:2rem;font-size:.85rem;color:#8a8a6a;background:#0003}@media (max-width: 600px){.hero h1{font-size:2.2rem}.tagline{font-size:1rem}.canvas-boundary{height:350px}}