@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@500;600;700;800&family=Noto+Sans+SC:wght@400;500;600;700;800&display=swap');

:root { --ink: #071525; --ink-2: #10243a; --slate: #63738a; --line: #dce5ee; --soft: #f4f7fa; --orange: #f47734; --orange-dark: #d95d1d; --blue: #2c78e3; --white: #fff; --radius: 18px; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font-family: 'Manrope','Noto Sans SC',Arial,sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.container { width: min(1160px, calc(100% - 48px)); margin: 0 auto; }
.topline { background: var(--ink); color: #aebdca; font-size: 11px; letter-spacing: .04em; }
.top-line-inner { min-height: 32px; display: flex; align-items: center; justify-content: space-between; }
.topline-right { color: #8193a5; }
.site-header { background: rgba(255,255,255,.94); border-bottom: 1px solid #edf1f5; position: sticky; top: 0; z-index: 10; backdrop-filter: blur(14px); }
.nav-wrap { min-height: 78px; display: flex; align-items: center; gap: 48px; }
.brand { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.brand strong { display: block; font-size: 17px; letter-spacing: -.04em; line-height: 1; }
.brand small { display: block; margin-top: 5px; color: #90a0b0; font-family: 'Noto Sans SC',sans-serif; font-size: 9px; letter-spacing: .08em; }
.brand-mark { width: 28px; height: 28px; display: flex; gap: 3px; align-items: end; padding: 5px; border-radius: 9px; background: var(--orange); transform: rotate(-8deg); }
.brand-mark i { display: block; flex: 1; border-radius: 2px 2px 1px 1px; background: #fff; }
.brand-mark i:nth-child(1) { height: 38%; opacity: .65; }.brand-mark i:nth-child(2) { height: 64%; opacity: .84; }.brand-mark i:nth-child(3) { height: 92%; }
.main-nav { display: flex; gap: 30px; margin-right: auto; align-items: center; font-size: 13px; color: #68798c; }
.main-nav a { position: relative; padding: 30px 0; }.main-nav a:hover, .main-nav .active { color: var(--ink); }.main-nav .active:after { content: ''; position: absolute; height: 2px; left: 0; right: 0; bottom: 20px; background: var(--orange); }
.nav-actions { display: flex; align-items: center; gap: 22px; font-size: 12px; }.login-link { color: #64768a; }.login-link:hover { color: var(--orange-dark); }
.button { display: inline-flex; gap: 24px; align-items: center; justify-content: center; border-radius: 6px; padding: 14px 20px; font-size: 12px; font-weight: 700; letter-spacing: .02em; transition: transform .2s, background .2s, box-shadow .2s; }.button:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(17,36,58,.14); }.button-small { padding: 11px 16px; gap: 12px; background: var(--ink); color: #fff; }.button-primary { background: var(--orange); color: #fff; padding: 16px 22px; }.button-primary:hover { background: var(--orange-dark); }.button-light { background: #fff; color: var(--ink); }.button-light:hover { color: var(--orange-dark); }
.menu-toggle { display: none; border: 0; background: none; padding: 8px; }.menu-toggle span { display: block; width: 22px; height: 2px; margin: 4px; background: var(--ink); }
.section-pad { padding: 112px 0; }
.hero-lede strong { color: var(--ink); font-weight: 700; }
.seo-copy { background: #f7f9fb; padding-top: 75px; padding-bottom: 75px; }
.seo-copy-inner { max-width: 850px; text-align: center; }
.seo-copy h2 { margin: 0; font-size: 34px; letter-spacing: -.06em; }
.seo-copy h2 span { color: var(--orange); }
.seo-copy p { max-width: 760px; margin: 20px auto 0; color: #778798; font: 13px/2 'Noto Sans SC'; }
.hero { overflow: hidden; background: linear-gradient(180deg,#f8fafc 0%,#fff 87%); padding-top: 94px; padding-bottom: 50px; }
.hero-grid { min-height: 520px; display: grid; grid-template-columns: .92fr 1.08fr; gap: 70px; align-items: center; }.eyebrow,.kicker { display: inline-flex; align-items: center; gap: 8px; color: var(--orange-dark); font-family: 'DM Mono',monospace; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }.eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 4px #ffe7d8; }
h1 { margin: 24px 0 22px; max-width: 580px; font-size: clamp(45px, 5.3vw, 72px); line-height: 1.1; letter-spacing: -.075em; font-weight: 800; }.hero h1 em { color: var(--orange); font-style: normal; display: block; }.hero-lede { max-width: 470px; margin: 0; color: #69798d; font-family: 'Noto Sans SC',sans-serif; font-size: 15px; line-height: 2; }.hero-actions { display: flex; gap: 28px; align-items: center; margin-top: 33px; }.text-button { display: inline-flex; gap: 12px; align-items: center; color: var(--ink); font-size: 12px; font-weight: 700; }.text-button span { color: var(--orange); font-size: 17px; transition: transform .2s; }.text-button:hover span { transform: translateX(4px); }.trust-row { margin-top: 55px; display: flex; gap: 13px; align-items: center; }.trust-avatars { display: flex; padding-left: 4px; }.trust-avatars span { width: 27px; height: 27px; margin-left: -4px; border: 2px solid #fff; display: grid; place-items: center; border-radius: 50%; background: #c7d7e9; color: #35516b; font: 10px 'Noto Sans SC'; }.trust-avatars span:nth-child(2) { background:#e8bca5; }.trust-avatars span:nth-child(3) { background:#d1c3e7; }.trust-avatars span:nth-child(4) { background:var(--ink); color:#fff; }.trust-row strong,.trust-row small { display:block; }.trust-row strong { font-size: 11px; }.trust-row small { margin-top: 4px; font-size: 10px; color: #8b99a9; font-family:'Noto Sans SC'; }
.hero-visual { min-height: 480px; position: relative; display: grid; place-items: center; }.hero-visual:before { content:''; width: 440px; height: 440px; position:absolute; border-radius:50%; background: #edf4fb; }.glow { position:absolute; border-radius:50%; filter:blur(1px); }.glow-one { width:140px;height:140px;right:8%;top:8%;background:#fff1e8; }.glow-two { width:90px;height:90px;left:5%;bottom:12%;background:#eaf4ff; }
.dash-card { position: relative; z-index: 1; width: min(100%, 470px); padding: 26px; color: #fff; border-radius: 15px; background: linear-gradient(140deg,#102944,#071727); box-shadow: 0 26px 60px rgba(9,30,52,.2); }.dash-top { display:flex; align-items:flex-start; justify-content:space-between; }.dash-label { display:block; color:#8fa4b8; font:10px 'Noto Sans SC'; }.dash-top strong { display:block; margin-top:7px; font-size: 17px; letter-spacing:-.04em; }.live-dot { color:#b5d5c7; background:rgba(158,211,186,.12); padding:6px 8px; border-radius:4px; font:10px 'DM Mono'; }.live-dot::first-letter { color:#6bd69a; }.metric-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:30px; }.metric { padding:17px 15px; border:1px solid rgba(255,255,255,.09); border-radius:9px; background:rgba(255,255,255,.035); }.metric small,.metric em { display:block; color:#8da2b5; font:10px 'Noto Sans SC'; font-style:normal; }.metric strong { display:block; margin:7px 0 5px; font-size:26px; }.metric strong span { color:#f48a4f; font-size:15px; }.dash-chart { padding-top:22px; }.chart-head { display:flex; justify-content:space-between; color:#96a9bb; font:10px 'Noto Sans SC'; }.chart-head b { color:#8ed5b0; font-weight:500; }.chart-head i { font-style:normal; }.chart-bars { height:98px; display:flex; gap:13px; align-items:end; margin-top:14px; padding:0 7px; border-bottom:1px solid rgba(255,255,255,.09); }.chart-bars i { width:20px; min-height:10px; border-radius:3px 3px 0 0; background:#284a68; }.chart-bars .current { background:var(--orange); }.chart-days { display:flex; justify-content:space-between; color:#647d95; margin-top:8px; font:8px 'DM Mono'; }.dash-list { display:grid; gap:9px; margin-top:22px; }.dash-list>div { display:flex; align-items:center; gap:10px; padding:10px; border-radius:7px; background:rgba(255,255,255,.06); }.dash-list>div>span:nth-child(2) { flex:1; }.dash-list b,.dash-list small { display:block; }.dash-list b { font-size:10px; font-weight:600; }.dash-list small { margin-top:3px; color:#8297aa; font:8px 'Noto Sans SC'; }.dash-list strong { color:#98d0ac; font:9px 'Noto Sans SC'; }.status-icon { width:25px;height:25px;display:grid;place-items:center;border-radius:6px;font-weight:700; }.status-icon.orange { color:#ffad7c;background:rgba(244,119,52,.16); }.status-icon.blue { color:#8dbaff;background:rgba(70,135,230,.16); }.float-card { position:absolute; z-index:2; display:flex; align-items:center; gap:9px; padding:11px 14px 11px 11px; border:1px solid #edf1f5; border-radius:9px; background:#fff; box-shadow:0 14px 30px rgba(27,52,75,.13); }.float-left { left:0; bottom:62px; }.float-right { right:-4px; top:62px; }.float-icon { display:grid;place-items:center;width:28px;height:28px;border-radius:7px;background:#e4f5e9;color:#2c9a58;font-weight:700; }.float-icon.purple { background:#f0e9ff;color:#8c6bda; }.float-card b,.float-card small { display:block; }.float-card b { font-size:10px; }.float-card small { margin-top:4px; color:#9aa7b5; font:8px 'Noto Sans SC'; }
.partner-strip { display:flex; align-items:center; gap:10px; padding-top:40px; color:#9caaba; font-size:10px; }.partner-strip>span { margin-right:15px; color:#7c8b9d; font-family:'Noto Sans SC'; }.partner-label { padding:10px 22px; border:1px solid #e2e9ef; border-radius:5px; color:#738499; font-family:'Noto Sans SC'; }
.products-section { background:#fff; }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; }.kicker { margin-bottom:18px; }.section-heading h2,.faq-grid h2 { margin:0; font-size:42px; line-height:1.25; letter-spacing:-.06em; }.section-heading h2 span,.faq-grid h2 span { color:var(--orange); }.section-heading p,.faq-grid>div>p { color:#8391a1; font:14px 'Noto Sans SC'; line-height:1.9; }.outline-button { padding:12px 15px; border:1px solid #dce5ee; border-radius:5px; color:#586c80; font-size:11px; }.outline-button span { margin-left:18px; color:var(--orange); font-size:16px; }.category-tabs { display:flex; align-items:center; gap:25px; margin-top:48px; border-bottom:1px solid #e6ebf0; }.category-tabs button { position:relative; border:0; padding:0 0 16px; background:none; color:#91a0af; cursor:pointer; font-size:12px; }.category-tabs button.selected,.category-tabs button:hover { color:var(--ink); }.category-tabs button.selected:after { content:''; position:absolute; height:2px; left:0; right:0; bottom:-1px; background:var(--orange); }.product-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; margin-top:28px; }.product-card { min-height:230px; padding:23px; border:1px solid #e3eaf0; border-radius:10px; transition:transform .2s, box-shadow .2s, border-color .2s; }.product-card:hover { transform:translateY(-5px); border-color:#cbd9e5; box-shadow:0 16px 30px rgba(27,51,75,.08); }.product-card.is-hidden { display:none; }.product-icon { width:40px;height:40px;display:grid;place-items:center;border-radius:11px;font-size:23px;font-weight:700; }.icon-orange { color:#ef752f;background:#fff0e6; }.icon-purple { color:#8866d4;background:#f0ebfc; }.icon-blue { color:#337edb;background:#eaf3ff; }.icon-green { color:#38a374;background:#e8f7f0; }.product-title { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:23px; }.product-title h3 { margin:0; font-size:17px; letter-spacing:-.04em; }.pill { padding:5px 6px; border-radius:3px; color:#dd6c27;background:#fff2e8;font:9px 'Noto Sans SC'; white-space:nowrap; }.purple-pill{color:#8562ce;background:#f1edfb}.blue-pill{color:#3478ce;background:#eaf3ff}.green-pill{color:#3a9a70;background:#e9f7f0}.product-card p { min-height:45px; margin:13px 0 20px; color:#8a98a6; font:11px/1.8 'Noto Sans SC'; }.product-foot { display:flex; justify-content:space-between; padding-top:14px; border-top:1px solid #edf1f4; color:#a3afba; font:10px 'Noto Sans SC'; }.product-foot a { color:var(--ink); }.product-foot a:hover { color:var(--orange-dark); }
.feature-band { background:var(--ink); color:#fff; }.feature-grid { display:grid; grid-template-columns: .82fr 1.18fr; gap:130px; align-items:center; }.light-kicker { color:#f9945e; }.feature-copy h2 { margin:0; font-size:48px; line-height:1.25; letter-spacing:-.07em; }.feature-copy h2 span { color:#f58b51; }.feature-copy p { max-width:340px; margin:22px 0 30px; color:#9eb1c2; font:13px/2 'Noto Sans SC'; }.feature-list { border-top:1px solid rgba(255,255,255,.17); }.feature-item { display:grid; grid-template-columns:58px 1fr; gap:22px; padding:25px 0; border-bottom:1px solid rgba(255,255,255,.17); }.feature-number { color:#e7773c; font:12px 'DM Mono'; padding-top:4px; }.feature-item h3 { margin:0; font-size:16px; letter-spacing:-.03em; }.feature-item p { margin:8px 0 0; color:#90a4b7; font:12px/1.8 'Noto Sans SC'; }
.process-section { background:#f7f9fb; }.center-heading { display:block; text-align:center; }.center-heading .kicker { justify-content:center; }.center-heading p { margin-bottom:0; }.process-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; margin-top:50px; }.process-card { position:relative; min-height:210px; padding:24px; border:1px solid #e3e9ef; border-radius:10px; background:#fff; }.process-card>span { color:var(--orange); font:11px 'DM Mono'; }.process-card h3 { margin:36px 0 12px; font-size:17px; letter-spacing:-.04em; }.process-card p { max-width:220px; margin:0; color:#8795a4; font:12px/1.9 'Noto Sans SC'; }.process-card i { position:absolute; right:22px; bottom:20px; color:#a0acb9; font-size:22px; font-style:normal; }.process-card:last-child i { color:var(--orange); }
.faq-section { background:#fff; }.faq-grid { display:grid; grid-template-columns:.78fr 1.22fr; gap:130px; }.faq-grid>div>p { max-width:270px; margin:21px 0 24px; }.faq-list { border-top:1px solid #dfe7ee; }.faq-list details { border-bottom:1px solid #dfe7ee; }.faq-list summary { display:flex; align-items:center; justify-content:space-between; padding:22px 0; list-style:none; cursor:pointer; font-size:14px; font-weight:600; }.faq-list summary::-webkit-details-marker { display:none; }.faq-list summary span { color:var(--orange); font-size:20px; font-weight:400; transition:transform .2s; }.faq-list details[open] summary span { transform:rotate(45deg); }.faq-list p { max-width:620px; padding:0 30px 22px 0; margin:0; color:#8694a3; font:12px/1.9 'Noto Sans SC'; }
.contact-section { padding:66px 0; background:linear-gradient(110deg,#ea6c2b,#f58f50); color:#fff; }.contact-inner { display:flex; justify-content:space-between; align-items:center; gap:30px; }.contact-inner .kicker { color:#ffddc8; }.contact-inner h2 { margin:0; font-size:35px; letter-spacing:-.06em; }.contact-inner p { margin:12px 0 0; color:#ffe7d9; font:13px 'Noto Sans SC'; }.contact-actions { display:flex; flex-direction:column; align-items:flex-end; gap:14px; }.contact-link { color:#ffe3d4; font:10px 'Noto Sans SC'; }.site-footer { background:#071525; color:#fff; }.footer-top { display:flex; justify-content:space-between; gap:60px; padding:65px 0 55px; }.footer-brand .brand-mark { background:#f47734; }.footer-links { display:flex; gap:85px; }.footer-links div { display:flex; flex-direction:column; gap:12px; min-width:95px; }.footer-links b { margin-bottom:5px; color:#fff; font:11px 'Noto Sans SC'; }.footer-links a { color:#8296aa; font:10px 'Noto Sans SC'; }.footer-links a:hover { color:#fff; }.footer-bottom { display:flex; justify-content:space-between; padding:18px 0; border-top:1px solid rgba(255,255,255,.1); color:#64798e; font:9px 'Noto Sans SC'; }.toast { position:fixed; left:50%; bottom:25px; z-index:20; padding:12px 18px; border-radius:5px; background:var(--ink); color:#fff; font-size:12px; opacity:0; pointer-events:none; transform:translate(-50%,10px); transition:opacity .2s, transform .2s; }.toast.show { opacity:1; transform:translate(-50%,0); }
@media (max-width: 900px) { .nav-wrap { gap:20px; }.main-nav { gap:17px; }.hero-grid { gap:30px; }.feature-grid,.faq-grid { gap:55px; }.product-grid { grid-template-columns:repeat(2,1fr); }.footer-links { gap:35px; } }
@media (max-width: 700px) { .container { width:min(100% - 34px, 560px); }.topline-right { display:none; }.topline .top-line-inner { min-height:28px; }.nav-wrap { min-height:68px; }.menu-toggle { display:block; margin-left:auto; }.main-nav { display:none; position:absolute; left:0; right:0; top:68px; padding:10px 17px 20px; flex-direction:column; align-items:stretch; gap:0; background:#fff; border-bottom:1px solid #e3eaf0; box-shadow:0 12px 20px rgba(7,21,37,.06); }.main-nav.open { display:flex; }.main-nav a { padding:13px 0; }.main-nav .active:after { display:none; }.nav-actions { display:none; }.hero { padding-top:64px; }.hero-grid { display:block; }.hero-copy { text-align:left; }.hero h1 { font-size:45px; }.hero-lede { font-size:14px; }.hero-actions { gap:18px; }.trust-row { margin-top:38px; }.hero-visual { min-height:410px; margin-top:35px; }.hero-visual:before { width:320px;height:320px; }.dash-card { padding:20px; }.float-left { left:-5px; bottom:36px; }.float-right { right:-5px; top:26px; }.partner-strip { display:grid; grid-template-columns:1fr 1fr; gap:9px; padding-top:20px; }.partner-strip>span { grid-column:1/-1; margin-bottom:3px; }.partner-label { padding:9px 10px; text-align:center; }.section-pad { padding:76px 0; }.section-heading { display:block; }.section-heading h2,.faq-grid h2 { font-size:34px; }.outline-button { display:inline-block; margin-top:22px; }.category-tabs { overflow-x:auto; gap:22px; margin-top:35px; white-space:nowrap; }.product-grid { grid-template-columns:1fr; }.product-card { min-height:0; }.feature-grid,.faq-grid { display:block; }.feature-copy { margin-bottom:45px; }.feature-copy h2 { font-size:40px; }.process-grid { grid-template-columns:1fr; margin-top:35px; }.process-card { min-height:175px; }.process-card h3 { margin-top:27px; }.faq-grid>div:first-child { margin-bottom:40px; }.contact-inner { display:block; }.contact-inner h2 { font-size:30px; }.contact-actions { align-items:flex-start; margin-top:25px; }.footer-top { display:block; padding:50px 0 35px; }.footer-links { gap:18px; margin-top:40px; justify-content:space-between; }.footer-links div { min-width:0; }.footer-bottom { display:block; line-height:2; }.footer-bottom span { display:block; }.footer-bottom span+span { margin-top:6px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *,*:before,*:after { transition:none !important; } }