.hero{padding:80px 0 50px;text-align:center;position:relative;overflow-x:clip}.hero:after{content:"";position:absolute;top:-120px;left:50%;transform:translate(-50%);width:min(800px,100%);height:700px;background:radial-gradient(ellipse at 50% 40%,rgba(245,158,11,.06) 0%,rgba(59,130,246,.02) 35%,transparent 65%);pointer-events:none}.badge{display:inline-flex;align-items:center;gap:8px;padding:5px 16px;background:#f59e0b0f;border:1px solid rgba(245,158,11,.1);border-radius:100px;font:500 12px var(--mono);color:var(--amber);letter-spacing:.03em;margin-bottom:32px}.hero h1{font:800 clamp(42px,6vw,68px)/1.05 var(--display);color:var(--text-bright);letter-spacing:-.04em;margin-bottom:20px}.hero h1 em{font-style:normal;color:var(--amber);text-shadow:0 0 40px rgba(245,158,11,.25)}.hero .sub{font:400 clamp(17px,2.2vw,21px)/1.55 var(--sans);color:var(--text-dim);max-width:480px;margin:0 auto 40px}.code-cta{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:18px 22px;max-width:540px;margin:0 auto 24px;text-align:left;position:relative;transition:border-color .2s}.code-cta:hover{border-color:var(--border-light)}.code-cta .lbl{font:500 10px var(--sans);text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim);margin-bottom:10px}.code-cta code{font:400 14px/1.6 var(--mono);color:var(--text-bright);display:block;white-space:nowrap;overflow-x:auto}.code-cta .t{color:var(--blue)}.code-cta .a{color:var(--amber)}.code-cta .s{color:#34d399}.code-cta .cp{position:absolute;top:16px;right:16px;background:#ffffff0d;border:1px solid rgba(255,255,255,.06);color:var(--text-dim);padding:4px 12px;border-radius:6px;cursor:pointer;font:500 11px var(--mono);transition:.15s}.code-cta .cp:hover{background:#ffffff1a;color:var(--text)}.hero-btns{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:6px;border-radius:8px;font:600 14px var(--sans);text-decoration:none;transition:.2s;cursor:pointer;border:none}.btn-primary{background:var(--amber);color:#0a0a0a;padding:11px 26px}.btn-primary:hover{background:#d97706;box-shadow:0 0 24px #f59e0b33}.btn-secondary{background:transparent;border:1px solid var(--border);color:var(--text);padding:10px 22px}.btn-secondary:hover{border-color:var(--border-light);color:var(--text-bright)}.btn-dim{background:none;border:1px dashed rgba(255,255,255,.08);color:var(--text-dim);padding:8px 16px;font-size:13px;font-weight:500;cursor:grab}.btn-dim:hover{border-color:var(--amber);color:var(--amber)}.demo-section{padding:60px 0 100px;border:none!important}.demo-section .section-label,.demo-section .section-title{text-align:center}.demo-section .section-desc{text-align:center;margin:0 auto 44px}.demo-container{position:relative}.demo-window{background:var(--surface);border:1px solid var(--border);border-radius:14px;overflow:hidden;position:relative;box-shadow:0 0 100px #f59e0b0a,0 30px 60px #0006}.demo-chrome{display:flex;align-items:center;gap:6px;padding:11px 16px;background:#ffffff04;border-bottom:1px solid var(--border)}.demo-dot{width:8px;height:8px;border-radius:50%}.demo-url{flex:1;margin-left:10px;background:var(--bg);border-radius:5px;padding:5px 12px;font:400 12px var(--mono);color:var(--text-dim)}.demo-url em{font-style:normal;color:var(--amber)}.demo-video{display:block;width:100%;height:auto;background:#fff}.demo-cap{margin-top:14px;text-align:center;font-size:13px;color:var(--text-dim)}.problem{padding:100px 0}.problem-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.problem-card{padding:30px 26px;border-radius:12px}.problem-card.bad{background:#ef44440a;border:1px solid rgba(239,68,68,.1)}.problem-card.good{background:#22c55e0a;border:1px solid rgba(34,197,94,.1)}.problem-card .tag{font:600 11px var(--mono);text-transform:uppercase;letter-spacing:.1em;margin-bottom:16px}.problem-card.bad .tag{color:var(--red)}.problem-card.good .tag{color:var(--green)}.problem-card ul{list-style:none;font-size:14px;line-height:1.75}.problem-card li{padding-left:22px;position:relative}.problem-card.bad li:before{content:"✕";position:absolute;left:0;color:var(--red);font-weight:700;font-size:12px}.problem-card.good li:before{content:"→";position:absolute;left:0;color:var(--green);font-weight:700}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.step{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px 20px;transition:border-color .2s}.step:hover{border-color:var(--border-light)}.step-num{font:600 11px var(--mono);color:var(--amber);margin-bottom:12px;letter-spacing:.05em}.step h3{font:600 15px var(--display);color:var(--text-bright);margin-bottom:6px;letter-spacing:-.01em}.step p{font-size:13px;color:var(--text-dim);line-height:1.5}.features{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:0 0 20px}.feature-pill{padding:7px 16px;background:var(--surface);border:1px solid var(--border);border-radius:100px;font:500 13px var(--sans);color:var(--text);letter-spacing:.01em}.pages-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.page-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px 20px;transition:border-color .2s}.page-card:hover{border-color:var(--border-light)}.page-card .count{font:600 12px var(--mono);color:var(--amber);margin-bottom:10px}.page-card h3{font:600 15px var(--mono);color:var(--text-bright);margin-bottom:6px}.page-card p{font-size:12px;color:var(--text-dim);line-height:1.6}.export-preview{background:var(--surface);border:1px solid var(--border);border-radius:14px;overflow:hidden;box-shadow:0 8px 30px #00000040}.export-header{display:flex;align-items:center;gap:6px;padding:11px 16px;background:#ffffff04;border-bottom:1px solid var(--border);font:400 12px var(--mono);color:var(--text-dim)}.dot{width:8px;height:8px;border-radius:50%}.dot-r{background:var(--red)}.dot-y{background:var(--amber)}.dot-g{background:var(--green)}.export-body{padding:22px;font:400 12.5px/1.75 var(--mono);color:var(--text);white-space:pre-wrap;overflow-x:auto;max-height:340px}.comparison{width:100%;border-collapse:collapse;font-size:13px}.comparison th,.comparison td{padding:12px 16px;text-align:left;border-bottom:1px solid rgba(20,30,58,.6)}.comparison th{font:600 10px var(--mono);color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em}.comparison td:first-child{color:var(--text-dim);font-weight:500}.comparison .us{color:var(--amber);font-weight:600}.comparison .yes{color:var(--green)}.comparison .no{color:var(--text-dim);opacity:.8}.comparison tr:hover td{background:#ffffff03}.table-scroll{overflow-x:auto}.try-list{list-style:none;max-width:560px;margin:34px auto 0;text-align:left;display:grid;gap:9px}.try-list li{font-size:14px;line-height:1.55;color:var(--text-dim);padding-left:20px;position:relative}.try-list li:before{content:"→";position:absolute;left:0;color:var(--amber)}.try-list b{color:var(--text);font-weight:500}.try-list em{font-style:normal;font-family:var(--mono);font-size:12px;color:var(--amber)}.table-note{margin-top:14px;font-size:12px;color:var(--text-dim);line-height:1.6}.table-note a{color:var(--blue)}.dev-code{margin-top:24px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:18px 22px;font:400 13px/1.6 var(--mono);color:var(--text);max-width:520px;overflow-wrap:anywhere}.dev-code .cm{color:var(--text-dim)}.dev-code .t{color:var(--blue)}.dev-code .a{color:var(--amber)}.dev-code .s{color:#34d399}.try-it{text-align:center;padding:80px 0 60px;position:relative;overflow-x:clip}.try-it:before{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:min(700px,100%);height:350px;background:radial-gradient(ellipse,rgba(245,158,11,.04) 0%,transparent 65%);pointer-events:none}.try-it h2{font:700 clamp(24px,3vw,32px) var(--display);color:var(--text-bright);margin-bottom:12px;letter-spacing:-.02em}.try-it p{color:var(--text-dim);margin-bottom:24px;font-size:15px}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.badge,.hero h1,.hero .sub,.code-cta,.hero-btns{animation:fadeUp .6s cubic-bezier(.16,1,.3,1) both}.hero h1{animation-delay:.1s}.hero .sub{animation-delay:.2s}.code-cta{animation-delay:.3s}.hero-btns{animation-delay:.4s}.scroll-hint{display:none}@media(max-width:768px){.hero{padding:64px 0 40px}section{padding:56px 0}.steps{grid-template-columns:1fr 1fr}.pages-grid,.problem-grid{grid-template-columns:1fr}.features{gap:8px}.feature-pill{font-size:12px;padding:7px 13px}.scroll-hint{display:block;font-size:12px;color:var(--text-dim);margin-bottom:8px}.comparison{font-size:12.5px}.comparison th,.comparison td{padding:9px 12px;white-space:nowrap}.comparison th:first-child,.comparison td:first-child{position:sticky;left:0;background:var(--bg);z-index:1;box-shadow:1px 0 #141e3a99}.export-body{max-height:260px;font-size:11.5px}}@media(max-width:600px){.demo-window{margin:0 -24px;border-radius:0;border-left:none;border-right:none}.demo-chrome{display:none}.demo-cap{margin-top:12px}}@media(max-width:480px){.steps{grid-template-columns:1fr}.hero-btns{flex-direction:column}}@media(pointer:coarse){.code-cta .cp{padding:9px 16px}.footer-links{gap:18px}.footer-links a{display:inline-block;padding:8px 4px}.try-list li{padding-top:2px;padding-bottom:2px}}
