.prod-hero{padding-top:clamp(72px,9vw,128px);padding-bottom:clamp(40px,5vw,64px)}.prod-hero h1{font-family:var(--font-display);font-weight:900;font-size:clamp(38px,5.6vw,72px);line-height:1.05;margin-top:20px;margin-bottom:24px}.prod-hero p{font-family:var(--font-serif);color:var(--ink-2);font-size:clamp(17px,1.4vw,21px);line-height:1.65;max-width:720px}.caps{display:grid;grid-template-columns:1fr;gap:16px;margin-top:48px}@media (min-width: 900px){.caps{grid-template-columns:repeat(6,1fr)}.cap--1,.cap--2{grid-column:span 3}.cap--3,.cap--4,.cap--5{grid-column:span 2}.cap--6,.cap--7{grid-column:span 3}}@media (min-width: 1100px){.cap--1,.cap--2{grid-column:span 3;min-height:380px}.cap--3,.cap--4,.cap--5{grid-column:span 2}.cap--6,.cap--7{grid-column:span 3}}.cap{position:relative;background:var(--panel);border:1px solid var(--rule);border-radius:var(--r-lg);padding:32px;display:flex;flex-direction:column;transition:border-color .22s var(--ease-out),transform .22s var(--ease-out),box-shadow .22s var(--ease-out);overflow:hidden}.cap:hover{transform:translateY(-6px);border-color:var(--rule-2);box-shadow:var(--shadow-lg)}.cap__head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px}.cap__num{font-family:var(--font-mono);font-weight:800;font-size:14px;color:var(--ink-3);letter-spacing:.18em}.cap:hover .cap__num{color:var(--accent)}.cap__icon{width:48px;height:48px;border-radius:12px;background:#5eff9b1f;border:1px solid rgba(94,255,155,.3);display:grid;place-items:center;color:var(--accent);transition:transform .22s var(--ease-out);overflow:hidden}.cap__icon img{width:100%;height:100%;display:block}.cap:hover .cap__icon{transform:rotate(4deg) scale(1.06)}.cap__icon--2{background:#ff7a591a;border-color:#ff7a594d;color:var(--accent-2)}.cap__icon--3{background:#b59cff1a;border-color:#b59cff4d;color:var(--accent-3)}.cap__icon--4{background:#ffd1661a;border-color:#ffd1664d;color:var(--warn)}.cap h3{font-family:var(--font-cn);font-weight:900;font-size:24px;line-height:1.25;margin-bottom:12px;color:var(--ink)}.cap p{font-family:var(--font-serif);color:var(--ink-2);font-size:15px;line-height:1.7;flex-grow:1}.cap__meta{display:inline-flex;align-items:center;gap:6px;margin-top:18px;padding:6px 12px;border-left:3px solid var(--accent-2);font-family:var(--font-mono);font-weight:700;font-size:12px;color:var(--accent-2);background:#ff7a5914;align-self:flex-start}.cap__demo{margin-top:24px;background:var(--bg-2);border:1px solid var(--rule);border-radius:var(--r-md);padding:16px 18px;font-family:var(--font-mono);font-size:13px;color:var(--ink-2);line-height:1.7;overflow:hidden}.cap__demo .l{color:var(--ink-3)}.cap__demo .k{color:var(--accent)}.cap__demo .v{color:var(--ink)}.cap__demo .ok{color:var(--accent-2)}.cap__flow{margin-top:24px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;font-family:var(--font-mono);font-size:11px;text-align:center;color:var(--ink-3)}.cap__flow .step{padding:14px 6px;border:1px solid var(--rule);border-radius:8px;background:var(--bg-2);position:relative;transition:border-color .22s var(--ease-out),color .22s var(--ease-out)}.cap__flow .step:after{content:"→";position:absolute;right:-10px;top:50%;transform:translateY(-50%);color:var(--accent)}.cap__flow .step:last-child:after{display:none}.cap:hover .cap__flow .step{border-color:#5eff9b4d;color:var(--ink)}.compare{margin-top:32px;background:var(--panel);border:1px solid var(--rule);border-radius:var(--r-lg);overflow:hidden}.compare table{width:100%;border-collapse:collapse}.compare th,.compare td{text-align:left;padding:18px 20px;font-family:var(--font-mono);font-size:13px;border-bottom:1px solid var(--rule)}.compare th{color:var(--ink-3);letter-spacing:.12em;font-weight:700;text-transform:uppercase}.compare tr:last-child td{border-bottom:none}.compare td.dim{color:var(--ink-3)}.compare td.win{color:var(--accent);font-weight:700;border-left:4px solid var(--accent)}.compare tr:hover td{background:#5eff9b0a}.timeline{position:relative;margin-top:48px;padding-left:28px}.timeline:before{content:"";position:absolute;left:8px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--accent),transparent)}.scenario{position:relative;margin-bottom:24px;background:var(--panel);border:1px solid var(--rule);border-radius:var(--r-lg);padding:32px;transition:transform .22s var(--ease-out),border-color .22s var(--ease-out)}.scenario:before{content:"";position:absolute;left:-28px;top:36px;width:18px;height:2px;background:var(--accent)}.scenario:after{content:"";position:absolute;left:-28px;top:30px;width:10px;height:10px;border-radius:50%;background:var(--bg);border:2px solid var(--accent);box-shadow:0 0 12px #5eff9b80}.scenario:hover{transform:translateY(-4px);border-color:#5eff9b4d}.scenario__time{font-family:var(--font-mono);font-size:13px;color:var(--ink-3);letter-spacing:.05em;margin-bottom:8px}.scenario__time strong{color:var(--accent);margin-right:8px;font-weight:700}.scenario__head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:20px}.scenario__num{font-family:var(--font-display);font-weight:900;font-size:clamp(48px,6vw,72px);color:var(--ink);opacity:.08;letter-spacing:-.04em;line-height:.8}.scenario__title h3{font-family:var(--font-cn);font-weight:900;font-size:clamp(22px,2.2vw,28px);color:var(--ink);margin-bottom:4px}.scenario__title small{font-family:var(--font-mono);font-size:13px;color:var(--ink-3);letter-spacing:.06em}.scenario__steps{display:grid;gap:12px}.scenario__step{display:grid;grid-template-columns:32px 1fr;gap:12px;padding:14px 16px;border-left:4px solid var(--accent-2);background:#ff7a590a;border-radius:0 8px 8px 0;transition:background .2s var(--ease-out)}.scenario__step:hover{background:#ff7a591a}.scenario__step .n{font-family:var(--font-mono);font-weight:800;color:var(--accent-2)}.scenario__step .t{font-family:var(--font-serif);color:var(--ink);font-size:15px;line-height:1.65}.scenario__metric{display:inline-flex;margin-top:18px;padding:6px 14px;border-radius:var(--r-pill);background:#5eff9b1f;border:1px solid rgba(94,255,155,.35);font-family:var(--font-mono);font-weight:700;font-size:13px;color:var(--accent)}.arch{display:grid;gap:12px;margin-top:32px}.arch__layer{position:relative;background:var(--panel);border:1px solid var(--rule);border-left-width:4px;border-radius:var(--r-md);padding:24px 28px}.arch__layer--1{border-left-color:var(--accent-2)}.arch__layer--2{border-left-color:var(--accent)}.arch__layer--3{border-left-color:var(--accent-3)}.arch__layer h4{font-family:var(--font-mono);font-size:13px;color:var(--ink-3);letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px}.arch__layer h5{font-family:var(--font-cn);font-weight:900;font-size:22px;margin-bottom:14px;color:var(--ink)}.arch__tags{display:flex;flex-wrap:wrap;gap:8px}.arch__tags span{font-family:var(--font-mono);font-size:12px;padding:4px 10px;background:#ffffff0a;border:1px solid var(--rule);border-radius:4px;color:var(--ink-2)}.arch__arrow{display:grid;place-items:center;height:24px;color:var(--ink-3);font-family:var(--font-mono);font-size:12px;letter-spacing:.05em}.arch__arrow span{padding:2px 10px;background:var(--bg-2);border:1px solid var(--rule);border-radius:4px}.demo{margin-top:32px;background:var(--bg-2);border:1px solid var(--rule);border-radius:var(--r-lg);padding:28px;display:grid;gap:24px}@media (min-width: 900px){.demo{grid-template-columns:1.4fr 1fr;align-items:stretch}}.browser{position:relative;background:var(--bg);border:1px solid var(--rule);border-radius:var(--r-md);overflow:hidden;box-shadow:0 24px 60px -20px #00000080;display:flex;flex-direction:column}.browser__bar{display:flex;align-items:center;gap:6px;padding:10px 14px;background:var(--bg-2);border-bottom:1px solid var(--rule)}.browser__dot{width:11px;height:11px;border-radius:50%;display:inline-block}.browser__dot--r{background:#ff5f57}.browser__dot--y{background:#febc2e}.browser__dot--g{background:#28c840}.browser__url{margin-left:14px;font-family:var(--font-mono);font-size:12px;color:var(--ink-3);background:var(--panel);border:1px solid var(--rule);border-radius:999px;padding:4px 12px;flex:1;max-width:70%}.browser__body{position:relative;padding:24px;flex:1;min-height:320px}.browser__nav{display:flex;gap:8px;margin-bottom:18px}.browser__chip{font-family:var(--font-mono);font-size:11px;color:var(--ink-3);border:1px solid var(--rule);border-radius:999px;padding:4px 12px;letter-spacing:.04em;transition:all .25s var(--ease-in-out)}.browser__chip.is-on{color:var(--accent);border-color:var(--accent);background:#5eff9b14}.browser__panel{display:none;flex-direction:column;gap:14px;animation:fade-up .4s var(--ease-in-out)}.browser__panel.is-on{display:flex}@keyframes fade-up{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.browser__field{display:flex;flex-direction:column;gap:6px;font-family:var(--font-mono);font-size:12px;color:var(--ink-3)}.browser__field span{letter-spacing:.04em}.browser__input{background:var(--panel);border:1px solid var(--rule);border-radius:var(--r-sm);padding:10px 12px;color:var(--ink);font-family:var(--font-mono);font-size:13px;caret-color:var(--accent);transition:border-color .2s,box-shadow .2s}.browser__input.is-typing{border-color:var(--accent);box-shadow:0 0 0 3px #5eff9b26}.browser__input--title{font-size:15px}.browser__field--body{flex:1}.browser__textarea{background:var(--panel);border:1px solid var(--rule);border-radius:var(--r-sm);padding:10px 12px;color:var(--ink);font-family:var(--font-mono);font-size:12px;line-height:1.7;min-height:80px;resize:none;caret-color:var(--accent);transition:border-color .2s,box-shadow .2s}.browser__textarea.is-typing{border-color:var(--accent);box-shadow:0 0 0 3px #5eff9b26}.browser__btn{align-self:flex-start;background:var(--accent);color:#0a0e1a;border:none;border-radius:var(--r-sm);padding:10px 20px;font-family:var(--font-display);font-weight:700;font-size:14px;cursor:pointer;transition:transform .2s,box-shadow .2s}.browser__btn.is-hover{box-shadow:0 0 0 4px #5eff9b40;transform:translateY(-1px)}.browser__btn--publish{background:var(--accent-2);color:#fff}.demo__log{font-family:var(--font-mono);font-size:12px;color:var(--ink-2);line-height:1.7;background:var(--panel);border:1px solid var(--rule);border-radius:var(--r-md);padding:20px;min-height:220px;max-height:320px;overflow:auto}.demo__log p{margin:0}.demo__log .t{color:var(--ink-3);margin-right:8px}.demo__log .ok{color:var(--accent)}.demo__log .key{color:var(--accent-2)}.demo__cursor{position:absolute;width:22px;height:22px;pointer-events:none;transform:translate(-50%,-50%);transition:top 1.2s var(--ease-in-out),left 1.2s var(--ease-in-out);filter:drop-shadow(0 0 8px rgba(94,255,155,.7));z-index:5}