body{margin:0;padding:0}*{margin:0;padding:0;box-sizing:border-box}:root{--color-green: #90c247;--color-red: #cc1b35;--color-blue: #55abda;--color-orange: #ee8706;--color-white: #ffffff;--color-dark: #1a1a1a;--color-gray: #f5f5f5;--color-text: #333333;--color-text-light: #666666;--spacing-sm: 1rem;--spacing-md: 2rem;--spacing-lg: 4rem;--spacing-xl: 6rem;--font-primary: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif}html{scroll-behavior:smooth}body{font-family:var(--font-primary);color:var(--color-text);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{overflow-x:hidden}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-md)}.interactive-logo{position:relative;width:280px;height:280px;margin:0 auto var(--spacing-md)}.logo-svg{width:100%;height:100%;filter:drop-shadow(0 10px 30px rgba(0,0,0,.1))}.logo-quadrant{cursor:pointer;transition:all .3s ease;transform-origin:center}.logo-quadrant:hover{transform:scale(1.15);filter:brightness(1.1) drop-shadow(0 0 20px currentColor)}.quadrant-content-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;color:#fff;text-align:center}.quadrant-letter{font-size:200px;font-weight:900;color:#fff;line-height:.8;text-shadow:0 4px 10px rgba(0,0,0,.2)}.quadrant-name{font-size:48px;font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:4px;margin-top:20px;text-shadow:0 4px 10px rgba(0,0,0,.2)}.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;padding:var(--spacing-xl) var(--spacing-md);overflow:hidden}.hero-gradient{position:absolute;inset:0;background:linear-gradient(135deg,#90c2471a,#55abda1a,#ee87061a 50%,#cc1b351a);z-index:-1;animation:gradientShift 15s ease infinite}@keyframes gradientShift{0%,to{opacity:1}50%{opacity:.7}}.hero-content{max-width:800px;z-index:1;animation:fadeInUp 1s ease}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.hero-logo{width:180px;height:auto;margin-bottom:var(--spacing-md);animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.hero-title{font-size:clamp(2.5rem,5vw,4rem);font-weight:800;line-height:1.2;margin-bottom:var(--spacing-md);color:var(--color-dark)}.hero-subtitle{font-size:clamp(1.1rem,2vw,1.4rem);color:var(--color-text-light);margin-bottom:var(--spacing-lg);line-height:1.6}.hero-cta{background:linear-gradient(135deg,var(--color-green),#7fb032);color:#fff;border:none;padding:1.2rem 3rem;border-radius:50px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 6px 20px #90c2474d}.hero-cta:hover{transform:translateY(-3px);box-shadow:0 10px 30px #90c24766}.story{padding:var(--spacing-xl) var(--spacing-md);background:var(--color-white)}.section-title{font-size:clamp(2rem,4vw,3rem);font-weight:800;text-align:center;margin-bottom:var(--spacing-lg);color:var(--color-dark)}.story-content{max-width:800px;margin:0 auto}.story-text{font-size:1.2rem;line-height:1.8;color:var(--color-text)}.story-text p{margin-bottom:1.5rem}.story-highlight{font-size:1.3rem;font-weight:600;color:var(--color-dark);padding:var(--spacing-md);background:linear-gradient(135deg,#cc1b351a,#90c2471a);border-left:4px solid var(--color-red);border-radius:8px;margin-top:var(--spacing-md)}.method-section{padding:var(--spacing-xl) var(--spacing-md);position:relative}.method-section.capture{background:linear-gradient(135deg,#cc1b350d,#cc1b351a)}.method-section.organize{background:linear-gradient(135deg,#ee87060d,#ee87061a)}.method-section.review{background:linear-gradient(135deg,#55abda0d,#55abda1a)}.method-section.execute{background:linear-gradient(135deg,#90c2470d,#90c2471a)}.method-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-lg);align-items:center;max-width:1200px;margin:0 auto}.method-content.reverse{grid-template-columns:1fr 1fr}.method-content.reverse .method-text{order:-1}.method-letter{font-size:clamp(8rem,15vw,12rem);font-weight:900;line-height:1;opacity:.3;text-align:center}.capture .method-letter{color:var(--color-red)}.organize .method-letter{color:var(--color-orange)}.review .method-letter{color:var(--color-blue)}.execute .method-letter{color:var(--color-green)}.method-icon-wrapper{display:flex;align-items:center;justify-content:center;padding:2rem}.section-icon{width:100%;max-width:400px;height:auto;transition:transform .3s ease;filter:drop-shadow(0 10px 20px rgba(0,0,0,.1))}.section-icon:hover{transform:scale(1.1)}.method-text h2{font-size:clamp(2rem,4vw,2.8rem);font-weight:800;margin-bottom:.5rem;color:var(--color-dark)}.method-text h3{font-size:clamp(1.3rem,2.5vw,1.8rem);font-weight:600;margin-bottom:var(--spacing-md);color:var(--color-text)}.method-text p{font-size:1.1rem;line-height:1.8;margin-bottom:1rem;color:var(--color-text)}.feature-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-top:var(--spacing-md)}.feature-item{background:#fffc;padding:1rem;border-radius:12px;font-weight:600;font-size:1rem;box-shadow:0 2px 8px #0000000d;transition:transform .3s ease}.feature-item:hover{transform:translateY(-4px)}.signup{padding:var(--spacing-xl) var(--spacing-md);background:linear-gradient(135deg,var(--color-green) 0%,var(--color-blue) 100%);color:#fff}.signup-content{max-width:600px;margin:0 auto;text-align:center}.signup-title{font-size:clamp(2rem,4vw,3rem);font-weight:800;margin-bottom:var(--spacing-md)}.signup-subtitle{font-size:1.2rem;line-height:1.6;margin-bottom:var(--spacing-lg);opacity:.95}.signup-form{display:flex;flex-direction:column;gap:1rem;margin-bottom:var(--spacing-md)}.signup-input{padding:1.2rem 1.5rem;font-size:1.1rem;border:none;border-radius:12px;background:#fff;color:var(--color-dark);box-shadow:0 4px 12px #0000001a;transition:all .3s ease}.signup-input:focus{outline:none;box-shadow:0 6px 20px #00000026;transform:translateY(-2px)}.signup-input::placeholder{color:#999}.signup-button{padding:1.2rem 2rem;font-size:1.1rem;font-weight:700;border:none;border-radius:12px;background:var(--color-dark);color:#fff;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #0003}.signup-button:hover:not(:disabled){background:#2a2a2a;transform:translateY(-2px);box-shadow:0 6px 20px #0000004d}.signup-button:disabled{opacity:.6;cursor:not-allowed}.message{padding:1rem;border-radius:12px;margin-bottom:var(--spacing-md);font-weight:600;animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.message.success{background:#fffffff2;color:var(--color-green)}.message.error{background:#fffffff2;color:var(--color-red)}.signup-note{font-size:1rem;opacity:.9}.footer{background:var(--color-dark);color:#fff;text-align:center;padding:var(--spacing-lg) var(--spacing-md)}.footer-logo{height:60px;width:auto;margin-bottom:var(--spacing-md);opacity:.9}.footer p{opacity:.7;font-size:.95rem}@media(max-width:768px){.interactive-logo{width:200px;height:200px}.quadrant-label{font-size:.75rem;padding:.4rem .8rem}.hero{padding:var(--spacing-lg) var(--spacing-sm);min-height:90vh}.section-icon{width:300px;height:300px}.story,.method-section,.signup{padding:var(--spacing-lg) var(--spacing-sm)}.method-content,.method-content.reverse{grid-template-columns:1fr;gap:var(--spacing-md);text-align:center}.method-content.reverse .method-text{order:0}.method-letter{font-size:6rem}.feature-list{grid-template-columns:1fr}.signup-form{gap:.75rem}.signup-input,.signup-button{padding:1rem 1.2rem;font-size:1rem}}@media(max-width:480px){.hero-title{font-size:2rem}.hero-subtitle{font-size:1rem}.hero-cta{padding:1rem 2rem;font-size:1rem}.story-text{font-size:1rem}.method-text h2{font-size:1.8rem}.method-text h3{font-size:1.2rem}.method-text p{font-size:1rem}}@media(prefers-reduced-motion:no-preference){.method-section,.story,.signup{opacity:0;animation:fadeInView .8s ease forwards}@keyframes fadeInView{to{opacity:1}}}
