:root{--bg-surface:#f9f9fa;--bg-card:#fff;--text-primary:#1a1b1e;--text-secondary:#5e646d;--text-inverse:#fff;--brand-primary:#0f1011;--brand-green:#047857;--brand-green-light:#d1fae5;--border-color:#e5e7eb;--radius-sm:6px;--radius-md:12px;--radius-lg:16px;--shadow-sm:0 1px 3px #0000000d;--shadow-md:0 4px 12px #0000000d}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-surface);color:var(--text-primary);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.5}.banner{color:#854d0e;background-color:#fef9c3;border-bottom:1px solid #fef08a;justify-content:center;align-items:center;gap:8px;padding:12px 16px;font-size:14px;display:flex}.container{max-w:1100px;flex-direction:column;align-items:center;margin:0 auto;padding:60px 24px;display:flex}.hero{text-align:center;margin-bottom:60px}.hero h1{letter-spacing:-1px;margin-bottom:16px;font-size:42px;font-weight:700}.subtitle{color:var(--text-secondary);max-w:600px;margin:0 auto;font-size:18px}.cards-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;width:100%;margin-bottom:60px;display:grid}.card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);text-align:center;box-shadow:var(--shadow-sm);flex-direction:column;align-items:center;padding:32px;transition:transform .2s,box-shadow .2s;display:flex}.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.card-number{background-color:var(--brand-green-light);width:48px;height:48px;color:var(--brand-green);border-radius:50%;justify-content:center;align-items:center;margin-bottom:24px;font-size:20px;font-weight:700;display:flex}.card h3{margin-bottom:12px;font-size:20px}.card p{color:var(--text-secondary);flex:1;margin-bottom:24px;font-size:14px}.btn{border-radius:var(--radius-sm);justify-content:center;align-items:center;width:100%;padding:12px 24px;font-size:15px;font-weight:500;text-decoration:none;transition:background-color .2s;display:inline-flex}.btn-primary{background-color:var(--brand-primary);color:var(--text-inverse)}.btn-primary:hover{background-color:#2c2d30}.btn-secondary{color:var(--brand-primary);border:1px solid var(--border-color);background-color:#0000}.btn-secondary:hover{background-color:#f3f4f6}.architecture-section{background:var(--brand-primary);color:var(--text-inverse);border-radius:var(--radius-lg);width:100%;box-shadow:var(--shadow-md);padding:48px}.architecture-section h2{text-align:center;margin-bottom:40px;font-size:28px}.arch-flow{flex-direction:column;align-items:center;gap:16px;margin-bottom:40px;display:flex}@media (width>=768px){.arch-flow{flex-direction:row;justify-content:space-between}}.arch-box{border-radius:var(--radius-sm);text-align:center;background:#ffffff1a;flex:1;width:100%;padding:16px 24px}.arch-label{text-transform:uppercase;letter-spacing:1px;color:var(--brand-green-light);margin-bottom:8px;font-size:11px;display:block}.arch-value{font-size:16px;font-weight:500}.arch-arrow{color:var(--brand-green-light);opacity:.5;font-size:24px}@media (width<=767px){.arch-arrow{transform:rotate(90deg)}}.tags{flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:40px;display:flex}.tag{color:var(--brand-green-light);background:#04785733;border:1px solid #04785766;border-radius:9999px;padding:6px 16px;font-size:13px;font-weight:500}.arch-explanation{color:#fffc;text-align:center;border-top:1px solid #ffffff1a;max-width:800px;margin:0 auto;padding-top:32px;font-size:14px;line-height:1.6}.arch-explanation strong{color:var(--brand-green-light);margin-bottom:8px;display:block}