:root{--black: #191f28;--white: #ffffff;--gray-50: #f9fafb;--gray-100: #f2f4f6;--gray-200: #e5e8eb;--gray-300: #d1d6db;--gray-400: #b0b8c1;--gray-500: #8b95a1;--gray-600: #6b7684;--gray-700: #4e5968;--gray-900: #191f28;--blue: #3182f6;--blue-light: #e8f3ff;--green: #00c853;--green-light: #e8f5e9;--yellow: #ffc107;--yellow-light: #fff8e1;--red: #f04452;--red-light: #ffebee}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--white);color:var(--gray-900);line-height:1.6}.nav{position:fixed;top:0;left:0;right:0;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--gray-100);z-index:100}.nav-inner{max-width:1200px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between}.nav-logo{font-size:20px;font-weight:700;color:var(--black);text-decoration:none}.nav-links{display:flex;align-items:center;gap:32px}.nav-links a{color:var(--gray-600);text-decoration:none;font-size:15px;transition:color .2s}.nav-links a:hover{color:var(--black)}.nav-cta{background:var(--black)!important;color:var(--white)!important;padding:10px 20px!important;border-radius:8px;font-weight:600!important}.hero{padding:140px 24px 80px;background:linear-gradient(180deg,var(--blue-light) 0%,var(--white) 100%)}.hero-content{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.hero-text h1{font-size:48px;font-weight:800;line-height:1.2;margin-bottom:24px;letter-spacing:-1px}.hero-text h1 .highlight{color:var(--blue)}.hero-sub{font-size:20px;color:var(--gray-600);margin-bottom:32px}.hero-sub strong{color:var(--black)}.hero-buttons{display:flex;gap:16px;margin-bottom:16px}.btn-primary{display:inline-flex;align-items:center;gap:8px;padding:16px 28px;background:var(--blue);color:var(--white);border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;text-decoration:none;transition:all .2s}.btn-primary:hover{background:#2563eb;transform:translateY(-2px)}.btn-primary.large{padding:18px 36px;font-size:18px}.btn-secondary{display:inline-flex;align-items:center;gap:8px;padding:16px 28px;background:var(--white);color:var(--gray-700);border:1px solid var(--gray-200);border-radius:12px;font-size:16px;font-weight:500;cursor:pointer;text-decoration:none;transition:all .2s}.btn-secondary:hover{background:var(--gray-50);border-color:var(--gray-300)}.btn-secondary.large{padding:18px 36px;font-size:18px}.hero-note{font-size:14px;color:var(--gray-500)}.hero-demo{position:relative}.chat-animation{background:var(--white);border-radius:24px;padding:32px;box-shadow:0 20px 60px #0000001a;min-height:400px;display:flex;flex-direction:column}.chat-container{flex:1;display:flex;flex-direction:column;gap:12px;overflow:hidden}.chat-bubble{max-width:85%;padding:14px 18px;border-radius:18px;animation:bubbleIn .4s ease-out;display:flex;align-items:center;gap:10px}@keyframes bubbleIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.chat-bubble.question{align-self:flex-end;background:var(--blue);color:var(--white);border-bottom-right-radius:4px}.chat-bubble.answer{align-self:flex-start;background:var(--gray-100);color:var(--gray-900);border-bottom-left-radius:4px}.bubble-icon{font-size:20px}.bubble-text{font-size:15px;font-weight:500}.penguin-character{display:flex;align-items:center;gap:12px;padding-top:20px;border-top:1px solid var(--gray-100);margin-top:20px}.penguin-body{font-size:40px;animation:bounce 2s infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.penguin-label{font-size:14px;color:var(--gray-500)}.section-inner{max-width:1200px;margin:0 auto;padding:0 24px}section h2{font-size:36px;font-weight:800;text-align:center;margin-bottom:16px;letter-spacing:-.5px}.section-desc{text-align:center;font-size:18px;color:var(--gray-500);margin-bottom:48px}.problem{padding:100px 24px;background:var(--gray-50)}.problem-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}.problem-card{background:var(--white);border-radius:20px;padding:32px;text-align:center;border:1px solid var(--gray-100)}.problem-icon{font-size:48px;margin-bottom:16px;display:block}.problem-card h3{font-size:20px;font-weight:700;margin-bottom:8px}.problem-card p{color:var(--gray-500);font-size:15px}.solution{padding:100px 24px}.solution-header{text-align:center;margin-bottom:48px}.solution-badge{display:inline-block;background:var(--blue-light);color:var(--blue);padding:8px 16px;border-radius:20px;font-size:14px;font-weight:600;margin-bottom:16px}.solution-demo{max-width:700px;margin:0 auto;display:flex;flex-direction:column;gap:24px}.demo-card{background:var(--white);border:1px solid var(--gray-200);border-radius:16px;overflow:hidden}.demo-question{display:flex;align-items:center;gap:12px;padding:20px 24px;background:var(--gray-50);border-bottom:1px solid var(--gray-100)}.q-icon{width:28px;height:28px;background:var(--blue);color:var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}.demo-question span:last-child{font-size:16px;font-weight:600}.demo-answer{display:flex;gap:16px;padding:24px;background:var(--green-light)}.demo-answer.warning{background:var(--yellow-light)}.demo-answer.danger{background:var(--red-light)}.a-icon{font-size:32px}.a-content strong{display:block;font-size:17px;margin-bottom:6px}.a-content p{font-size:14px;color:var(--gray-600)}.cases{padding:100px 24px;background:var(--gray-50)}.cases-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.case-card{background:var(--white);border-radius:20px;padding:28px;border:1px solid var(--gray-100);transition:all .3s}.case-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px #0000001a}.case-icon{font-size:40px;margin-bottom:12px}.case-category{font-size:13px;font-weight:600;color:var(--accent);margin-bottom:8px}.case-problem{font-size:17px;font-weight:700;margin-bottom:12px;line-height:1.4}.case-detail{font-size:14px;color:var(--gray-500);margin-bottom:16px}.case-solution{display:flex;align-items:flex-start;gap:8px;padding:12px;background:var(--gray-50);border-radius:10px;font-size:13px;color:var(--gray-700)}.solution-arrow{color:var(--green);font-weight:700}.steps{padding:100px 24px}.steps-grid{display:flex;align-items:center;justify-content:center;gap:24px;margin-bottom:48px}.step-item{text-align:center;padding:32px}.step-number{width:56px;height:56px;background:var(--blue);color:var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;margin:0 auto 16px}.step-item h3{font-size:18px;font-weight:700;margin-bottom:8px}.step-item p{font-size:14px;color:var(--gray-500)}.step-arrow{font-size:24px;color:var(--gray-300)}.steps-cta{text-align:center}.pricing{padding:100px 24px;background:var(--gray-50)}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:960px;margin:0 auto}.pricing-grid.four-tier{grid-template-columns:repeat(4,1fr);max-width:1100px}.pricing-card{background:var(--white);border:1px solid var(--gray-100);border-radius:20px;padding:32px 24px;position:relative}.pricing-card.featured{border:2px solid var(--black)}.pricing-badge{position:absolute;top:-12px;left:50%;transform:translate(-50%);background:var(--black);color:var(--white);padding:4px 14px;border-radius:20px;font-size:12px;font-weight:600}.pricing-name{font-size:18px;font-weight:600;margin-bottom:16px}.pricing-price{margin-bottom:24px}.pricing-price .amount{font-size:32px;font-weight:700;letter-spacing:-1px}.pricing-price .period{font-size:15px;color:var(--gray-500)}.pricing-features{list-style:none;margin-bottom:32px}.pricing-features li{padding:10px 0;font-size:14px;color:var(--gray-700);border-bottom:1px solid var(--gray-100)}.pricing-features li:last-child{border-bottom:none}.pricing-btn{display:block;width:100%;padding:14px;text-align:center;border-radius:10px;font-size:15px;font-weight:600;text-decoration:none;transition:all .2s}.pricing-btn.primary{background:var(--black);color:var(--white)}.pricing-btn.primary:hover{background:#333}.pricing-btn.secondary{background:var(--gray-100);color:var(--gray-700)}.pricing-btn.secondary:hover{background:var(--gray-200)}.final-cta{padding:100px 24px;background:linear-gradient(180deg,var(--white) 0%,var(--blue-light) 100%);text-align:center}.final-cta h2{font-size:40px;margin-bottom:32px}.cta-buttons{display:flex;gap:16px;justify-content:center}.footer{background:var(--gray-900);color:var(--white);padding:60px 24px}.footer-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 2fr 1fr;gap:40px;align-items:start}.footer-logo{font-size:20px;font-weight:700}.footer-brand p{color:var(--gray-400);font-size:14px;margin-top:8px}.footer-links{display:flex;gap:32px;justify-content:center}.footer-links a{color:var(--gray-400);text-decoration:none;font-size:14px;transition:color .2s}.footer-links a:hover{color:var(--white)}.footer-copy{text-align:right;font-size:13px;color:var(--gray-500)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;padding:24px}.modal{background:var(--white);border-radius:24px;padding:40px;width:100%;max-width:480px;position:relative;animation:modalIn .3s ease-out}@keyframes modalIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.modal-close{position:absolute;top:20px;right:20px;width:32px;height:32px;background:var(--gray-100);border:none;border-radius:50%;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--gray-500)}.modal-close:hover{background:var(--gray-200)}.modal-icon{font-size:48px;text-align:center;margin-bottom:16px}.modal h2{font-size:24px;text-align:center;margin-bottom:8px}.modal-desc{text-align:center;color:var(--gray-500);margin-bottom:24px}.modal form{display:flex;flex-direction:column;gap:12px}.modal input{padding:16px;border:1px solid var(--gray-200);border-radius:12px;font-size:15px;outline:none;transition:border-color .2s}.modal input:focus{border-color:var(--blue)}.modal button[type=submit]{padding:16px;background:var(--blue);color:var(--white);border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}.modal button[type=submit]:disabled{background:var(--gray-300);cursor:not-allowed}.spinner-small{width:18px;height:18px;border:2px solid rgba(255,255,255,.3);border-top-color:var(--white);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.modal-hint{text-align:center;font-size:13px;color:var(--gray-400);margin-top:12px}.result-box{background:var(--gray-50);border-radius:12px;padding:20px;margin:24px 0}.result-item{margin-bottom:12px}.result-label{font-size:12px;color:var(--gray-500);display:block;margin-bottom:4px}.result-value{font-size:14px;word-break:break-all}.result-value.original{color:var(--gray-500)}.result-value.tracking{color:var(--blue);font-weight:600}.result-arrow{text-align:center;color:var(--gray-400);padding:8px 0}.btn-copy{width:100%;padding:16px;background:var(--black);color:var(--white);border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer}.result-guide{margin-top:24px;padding:20px;background:var(--blue-light);border-radius:12px}.result-guide h4{font-size:14px;font-weight:600;margin-bottom:12px}.result-guide ol{padding-left:20px}.result-guide li{font-size:14px;color:var(--gray-700);margin-bottom:6px}.modal-cta{text-align:center;font-size:14px;color:var(--gray-500);margin-top:20px}.modal-cta a{color:var(--blue);font-weight:600}@media (max-width: 1024px){.hero-content{grid-template-columns:1fr;text-align:center}.hero-text h1{font-size:36px}.hero-buttons{justify-content:center}.hero-demo{max-width:500px;margin:0 auto}.problem-grid{grid-template-columns:1fr;max-width:400px;margin:48px auto 0}.cases-grid{grid-template-columns:repeat(2,1fr)}.pricing-grid,.pricing-grid.four-tier{grid-template-columns:1fr;max-width:360px}.footer-inner{grid-template-columns:1fr;text-align:center}.footer-links{flex-wrap:wrap;justify-content:center}.footer-copy{text-align:center}}@media (max-width: 768px){.nav-links a:not(.nav-cta){display:none}.hero{padding:120px 16px 60px}.hero-text h1{font-size:28px}.hero-sub{font-size:16px}.hero-buttons{flex-direction:column}section h2{font-size:28px}.steps-grid{flex-direction:column}.step-arrow{transform:rotate(90deg)}.cases-grid{grid-template-columns:1fr}.cta-buttons{flex-direction:column;align-items:center}.final-cta h2{font-size:28px}}.hero-session-demo{display:flex;flex-direction:column;gap:16px}.session-screen{background:#1a1a2e;border-radius:16px;overflow:hidden;box-shadow:0 20px 60px #0000004d}.screen-header{display:flex;align-items:center;padding:10px 14px;background:#252538;gap:10px}.screen-dots{display:flex;gap:6px}.screen-dots .dot{width:10px;height:10px;border-radius:50%}.dot.red{background:#ff5f56}.dot.yellow{background:#ffbd2e}.dot.green{background:#27ca40}.screen-title{flex:1;font-size:12px;color:#888}.screen-time{font-size:12px;color:#888;font-family:monospace}.screen-content{position:relative;height:280px;background:#f8f9fa;overflow:hidden}.screen-content .fake-page{position:absolute;top:0;left:0;right:0;height:250%;padding:12px;transition:transform .5s ease-out}.fp-header{height:32px;background:#fff;border-radius:6px;margin-bottom:10px}.fp-product{display:flex;gap:12px;background:#fff;border-radius:10px;padding:14px;margin-bottom:10px}.fp-image{width:100px;height:100px;background:linear-gradient(135deg,#e0e0e0,#f0f0f0);border-radius:8px;flex-shrink:0}.fp-info{flex:1;min-width:0}.fp-title{height:18px;background:#e0e0e0;border-radius:4px;margin-bottom:8px;width:80%}.fp-price{font-size:18px;font-weight:700;color:#333;margin-bottom:10px}.fp-option{position:relative;padding:10px 12px;background:#f0f0f0;border:1px solid #ddd;border-radius:6px;font-size:12px;color:#666;margin-bottom:8px;transition:all .2s}.fp-option.clicking{background:#e3f2fd;border-color:#2196f3;transform:scale(.98)}.rage-badge{position:absolute;top:-6px;right:-6px;background:#f44336;padding:2px 6px;border-radius:8px;font-size:10px;animation:shake .3s infinite}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}.fp-cart{padding:10px;background:var(--blue);color:#fff;text-align:center;border-radius:6px;font-size:12px;font-weight:600}.fp-desc{background:#fff;border-radius:10px;padding:14px;margin-bottom:10px}.fp-line{height:12px;background:#e8e8e8;border-radius:4px;margin-bottom:8px}.fp-line.short{width:60%}.fp-reviews{background:#fff;border-radius:10px;padding:14px}.fp-review{height:40px;background:#f5f5f5;border-radius:6px;margin-bottom:8px}.screen-cursor{position:absolute;pointer-events:none;transition:all .4s ease-out;z-index:10}.screen-cursor.click svg path{fill:var(--blue)}.exit-screen{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000bf;display:flex;align-items:center;justify-content:center;animation:fadeIn .3s}.exit-screen span{background:#f44336;color:#fff;padding:12px 24px;border-radius:10px;font-size:18px;font-weight:600}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.screen-timeline{display:flex;justify-content:center;gap:8px;padding:12px;background:#252538}.tl-dot{width:8px;height:8px;background:#444;border-radius:50%;transition:all .3s}.tl-dot.past{background:#666}.tl-dot.active{background:var(--blue);transform:scale(1.3)}.tl-dot.rage{background:#f44336}.penguin-analysis{display:flex;align-items:center;gap:12px;background:#fff;border-radius:16px;padding:16px;box-shadow:0 4px 20px #00000014}.penguin-avatar{font-size:40px;animation:bounce 2s infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.penguin-bubble-area{flex:1}.penguin-bubble{display:inline-block;padding:10px 16px;background:#f0f0f0;border-radius:16px 16px 16px 4px;font-size:14px;font-weight:500;color:#333;animation:bubbleIn .3s ease-out}.penguin-bubble.info{background:#e3f2fd;color:#1565c0}.penguin-bubble.warning{background:#fff3e0;color:#e65100}.penguin-bubble.danger{background:#ffebee;color:#c62828}@keyframes bubbleIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.analysis-stats{display:flex;gap:16px}.analysis-stats .stat{text-align:center}.stat-label{display:block;font-size:11px;color:#888;margin-bottom:2px}.stat-value{font-size:16px;font-weight:700;color:#333}
