@charset "UTF-8";

:root {
  color-scheme: dark;
  --bg: #070b16;
  --bg-deep: #050811;
  --surface: #0b1223;
  --surface-soft: #0f1930;
  --line: rgba(151, 175, 222, .15);
  --line-strong: rgba(151, 175, 222, .27);
  --text: #f4f6ff;
  --muted: #a4aec5;
  --quiet: #737f9d;
  --blue: #91b7ff;
  --cyan: #91e4ee;
  --violet: #b5a2ff;
  --mint: #87e7d0;
  --content: 1160px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
  scroll-padding-top: 96px;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: var(--bg); color: var(--text); font-size: 16px; line-height: 1.65; }
body::before { position: fixed; z-index: -1; inset: 0; content: ""; pointer-events: none; background: radial-gradient(ellipse 54% 46% at 88% 2%, rgba(60, 92, 190, .16), transparent 74%), radial-gradient(ellipse 40% 34% at 10% 18%, rgba(26, 107, 150, .1), transparent 75%), linear-gradient(180deg, #080d1b 0%, #070b16 64%, #080c18 100%); }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
.page-width { width: min(var(--content), calc(100% - 64px)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 100; top: 8px; left: 8px; padding: 10px 14px; transform: translateY(-150%); border-radius: 10px; background: white; color: #071020; font-weight: 700; }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 2px solid #a8d7ff; outline-offset: 4px; }

.site-header { position: sticky; z-index: 20; top: 0; border-bottom: 1px solid rgba(160, 180, 226, .1); background: rgba(7, 11, 22, .82); backdrop-filter: blur(20px); }
.header-inner { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand { display: inline-flex; align-items: center; gap: 12px; min-width: max-content; }
.brand img { width: 100px; height: 36px; object-fit: contain; object-position: left center; }
.brand-divider { width: 1px; height: 22px; background: rgba(204, 218, 255, .22); }
.brand-name { color: #c8d5f0; font-size: 14px; font-weight: 600; letter-spacing: .02em; }
.site-nav { display: flex; align-items: center; gap: clamp(18px, 3vw, 36px); color: #b3bfd9; font-size: 14px; }
.site-nav > a:not(.nav-cta) { transition: color .2s ease; }
.site-nav > a:not(.nav-cta):hover { color: white; }
.nav-cta { display: inline-flex; align-items: center; gap: 13px; padding: 10px 17px; border: 1px solid rgba(145, 183, 255, .34); border-radius: 999px; background: rgba(66, 104, 184, .16); color: #e5edff; font-weight: 650; transition: background .2s ease, border-color .2s ease, transform .2s ease; }
.nav-cta:hover { transform: translateY(-1px); border-color: rgba(164, 203, 255, .7); background: rgba(71, 118, 215, .25); }
.menu-toggle { display: none; }

.hero { position: relative; display: grid; grid-template-columns: minmax(0, .9fr) minmax(470px, 1.1fr); align-items: center; gap: 28px; min-height: 710px; padding-top: 74px; padding-bottom: 104px; overflow-x: clip; }
.hero-copy { position: relative; z-index: 2; padding-bottom: 8px; }
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 22px; color: #a8b9db; font-size: 12px; font-weight: 700; letter-spacing: .16em; line-height: 1.4; }
.eyebrow-line { width: 23px; height: 1px; background: linear-gradient(90deg, var(--cyan), var(--violet)); }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 660px; margin-bottom: 22px; font-size: clamp(44px, 5.2vw, 66px); font-weight: 680; letter-spacing: -.065em; line-height: 1.2; }
h1 span, .section-heading h2 span, .privacy-copy h2 span { color: #a8b8ff; }
.hero-lede { max-width: 515px; margin-bottom: 32px; color: #b3bdd1; font-size: 17px; line-height: 1.9; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 13px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 20px; min-height: 50px; padding: 0 21px; border: 1px solid transparent; border-radius: 14px; font-size: 14px; font-weight: 700; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: linear-gradient(110deg, #89baff, #aaa3ff); color: #081020; box-shadow: 0 10px 30px rgba(107, 133, 227, .22); }
.button-primary:hover { background: linear-gradient(110deg, #aad0ff, #c1b9ff); }
.button-quiet { border-color: var(--line-strong); background: rgba(14, 23, 43, .55); color: #d8e2fa; }
.button-quiet:hover { border-color: rgba(169, 194, 255, .48); background: rgba(25, 39, 69, .7); }
.button-download { border-color: rgba(135, 231, 208, .45); background: linear-gradient(110deg, #91e4ee, #87e7d0); color: #07151b; box-shadow: 0 10px 30px rgba(77, 190, 177, .15); }
.button-download:hover { border-color: rgba(181, 255, 238, .8); background: linear-gradient(110deg, #b1f4f4, #a9f5dc); }
.download-note { margin: 10px 0 0; color: #8997b1; font-size: 13px; }
.download-note strong { color: #c4d3ee; font-weight: 650; letter-spacing: .06em; }
.hero-facts { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 48px; padding-top: 22px; border-top: 1px solid var(--line); }
.hero-facts div { display: grid; gap: 2px; }
.hero-facts strong { color: #f5f6ff; font-size: 17px; font-weight: 650; }
.hero-facts span { color: #8f9ab4; font-size: 13px; }
.hero-visual { position: relative; min-width: 0; perspective: 1200px; }
.visual-orbit { position: absolute; z-index: -1; border: 1px solid rgba(132, 161, 243, .11); border-radius: 50%; pointer-events: none; }
.orbit-one { width: 570px; height: 570px; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-22deg); }
.orbit-two { width: 460px; height: 460px; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(35deg); border-style: dashed; border-color: rgba(137, 213, 233, .1); }
.workspace-window { position: relative; z-index: 1; overflow: hidden; border: 1px solid rgba(154, 181, 232, .25); border-radius: 20px; background: linear-gradient(145deg, rgba(18, 31, 59, .96), rgba(8, 14, 29, .98) 68%); box-shadow: 0 42px 100px rgba(0, 0, 0, .48), 0 0 80px rgba(66, 96, 201, .14), inset 0 1px rgba(255, 255, 255, .08); transform: rotateY(-5deg) rotateX(2deg); transform-origin: center; }
.window-topbar { display: flex; align-items: center; min-height: 46px; padding: 0 15px; border-bottom: 1px solid rgba(159, 181, 228, .12); background: rgba(255, 255, 255, .015); }
.window-controls { display: flex; gap: 5px; }
.window-controls i { width: 7px; height: 7px; border-radius: 50%; background: #697894; }
.window-controls i:first-child { background: #d98a95; }.window-controls i:nth-child(2) { background: #d6b678; }.window-controls i:nth-child(3) { background: #79c4aa; }
.window-title { margin-left: 17px; color: #dce4f6; font-size: 11px; font-weight: 700; letter-spacing: .04em; }.window-title span { margin: 0 5px; color: #6c7999; }
.local-tag { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 4px 8px; border: 1px solid rgba(129, 218, 196, .22); border-radius: 999px; color: #a9e6d6; font-size: 9px; }
.local-tag i, .status-chip i { width: 6px; height: 6px; border-radius: 50%; background: #7de0c2; box-shadow: 0 0 8px rgba(125, 224, 194, .65); }
.window-body { display: flex; min-height: 360px; }
.workspace-rail { display: flex; flex: 0 0 49px; flex-direction: column; align-items: center; gap: 14px; padding: 14px 0; border-right: 1px solid rgba(159, 181, 228, .11); background: rgba(2, 7, 18, .24); }
.rail-logo { display: grid; place-items: center; width: 25px; height: 25px; margin-bottom: 4px; border-radius: 7px; background: linear-gradient(135deg, #4074ca, #796ce1); }.rail-logo img { width: 16px; height: 16px; }
.rail-icon { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 8px; color: #71809f; font-size: 15px; }.rail-icon.active { border: 1px solid rgba(127, 172, 255, .2); background: rgba(100, 144, 237, .16); color: #b7d3ff; }.rail-spacer { flex: 1; }
.workspace-content { flex: 1; min-width: 0; padding: 19px 20px 12px; }
.workspace-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 17px; }.workspace-overline { display: block; color: #7f8eaf; font-size: 8px; font-weight: 750; letter-spacing: .16em; line-height: 1.4; }.workspace-heading h2 { margin: 4px 0 0; font-size: 19px; font-weight: 650; letter-spacing: -.02em; }.period-pill { padding: 5px 9px; border: 1px solid rgba(155, 179, 229, .15); border-radius: 8px; color: #a9b6d0; font-size: 9px; }.period-pill b { margin-left: 8px; color: #8190ab; }
.metric-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }.metric-card { min-width: 0; padding: 10px; border: 1px solid rgba(148, 171, 220, .14); border-radius: 10px; background: rgba(255, 255, 255, .025); }.metric-card > span:first-child { display: block; color: #8997b2; font-size: 9px; }.metric-card strong { display: block; margin-top: 2px; color: #edf2ff; font-size: 22px; font-weight: 600; line-height: 1.35; }.metric-card strong small { color: #8491ac; font-size: 10px; font-weight: 500; }.metric-track { height: 3px; margin-top: 8px; border-radius: 4px; background: #27324c; }.metric-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #79c9e1, #83adff); }.metric-track.violet i { background: linear-gradient(90deg, #a190fa, #7fcde2); }.metric-track.progress-80 i { width: 80%; }.metric-track.progress-100 i { width: 100%; }.metric-caption { display: block; margin-top: 6px; color: #7583a0; font-size: 8px; }
.workspace-lower { display: grid; grid-template-columns: 1.1fr .9fr; gap: 9px; margin-top: 10px; }.accounts-card, .draft-card { min-width: 0; padding: 12px; border: 1px solid rgba(148, 171, 220, .13); border-radius: 11px; background: rgba(255, 255, 255, .022); }.card-heading { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin-bottom: 8px; }.card-heading h3 { margin: 3px 0 0; font-size: 12px; font-weight: 650; }.small-link { color: #9ab2df; font-size: 8px; white-space: nowrap; }.small-link b { margin-left: 3px; }.account-row { display: flex; align-items: center; gap: 7px; padding: 7px 0; border-top: 1px solid rgba(148, 171, 220, .09); }.account-mark { display: grid; flex: 0 0 23px; place-items: center; width: 23px; height: 23px; border: 1px solid rgba(255, 255, 255, .1); border-radius: 8px; font-size: 9px; font-weight: 750; }.mark-blue { background: rgba(81, 143, 223, .18); color: #a9d1ff; }.mark-pink { background: rgba(204, 111, 167, .16); color: #ffc1df; }.mark-teal { background: rgba(69, 180, 166, .16); color: #a2ead8; }.account-name { display: grid; min-width: 0; gap: 1px; }.account-name b { overflow: hidden; color: #d6def0; font-size: 9px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }.account-name small { color: #7c89a5; font-size: 8px; }.status-chip { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; padding: 3px 5px; border: 1px solid rgba(121, 220, 191, .14); border-radius: 999px; color: #9edecb; font-size: 8px; white-space: nowrap; }.status-chip i { width: 4px; height: 4px; }
.draft-card { position: relative; overflow: hidden; background: linear-gradient(150deg, rgba(45, 63, 116, .26), rgba(18, 31, 58, .2)); }.draft-orb { display: grid; place-items: center; width: 31px; height: 31px; margin-bottom: 19px; border: 1px solid rgba(168, 154, 255, .3); border-radius: 10px; background: rgba(117, 103, 202, .17); color: #cabfff; font-size: 16px; }.draft-card h3 { margin: 6px 0 5px; font-size: 12px; }.draft-card p { min-height: 42px; margin-bottom: 12px; color: #9aa8c2; font-size: 9px; line-height: 1.65; }.draft-action { display: flex; justify-content: space-between; align-items: center; padding-top: 8px; border-top: 1px solid rgba(148, 171, 220, .11); color: #c7d5f1; font-size: 9px; }.draft-action b { color: #9bafff; }.mock-caption { display: flex; align-items: center; gap: 6px; justify-content: flex-end; margin-top: 8px; color: #7e8ba5; font-size: 8px; }.mock-caption span { width: 5px; height: 5px; border-radius: 50%; background: #9b8bfa; }
.float-note { position: absolute; z-index: 3; display: flex; align-items: center; gap: 10px; padding: 11px 14px; border: 1px solid rgba(174, 195, 241, .2); border-radius: 13px; background: rgba(14, 23, 45, .88); box-shadow: 0 12px 40px rgba(0, 0, 0, .35); backdrop-filter: blur(15px); }.float-note > span:last-child { display: grid; gap: 1px; }.float-note b { color: #e7edff; font-size: 11px; }.float-note small { color: #8e9bb7; font-size: 9px; }.note-top { top: -19px; right: 20px; }.note-bottom { right: -18px; bottom: 20px; }.note-icon, .api-spark { display: grid; place-items: center; width: 29px; height: 29px; border: 1px solid rgba(136, 214, 202, .22); border-radius: 9px; background: rgba(71, 159, 147, .14); color: #9de4d5; font-size: 14px; }.api-spark { border-color: rgba(174, 152, 255, .25); background: rgba(109, 87, 194, .18); color: #d0c1ff; font-size: 10px; font-weight: 800; }
.scroll-cue { position: absolute; bottom: 33px; left: 0; display: inline-flex; align-items: center; gap: 11px; color: #8591aa; font-size: 12px; }.scroll-cue span { position: relative; width: 18px; height: 29px; border: 1px solid rgba(162, 184, 231, .36); border-radius: 20px; }.scroll-cue span::after { position: absolute; top: 6px; left: 7px; width: 2px; height: 5px; border-radius: 2px; background: #b0c5f5; content: ""; }

.capability-strip { border-top: 1px solid rgba(152, 175, 224, .1); border-bottom: 1px solid rgba(152, 175, 224, .1); background: rgba(255, 255, 255, .018); }.strip-inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; min-height: 76px; color: #98a4be; font-size: 13px; }.strip-items { display: flex; flex-wrap: wrap; align-items: center; gap: 15px; color: #d1d9eb; font-size: 12px; }.strip-items a { color: #d1d9eb; transition: color .2s ease; }.strip-items a:hover { color: #fff; }.strip-items i { width: 4px; height: 4px; border-radius: 50%; background: #8096d7; }
.section { padding-top: 112px; padding-bottom: 112px; }.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 35px; margin-bottom: 43px; }.section-heading .eyebrow { margin-bottom: 17px; }.section-heading h2, .privacy-copy h2, .faq-intro h2 { margin: 0; font-size: clamp(34px, 4vw, 48px); font-weight: 650; letter-spacing: -.055em; line-height: 1.28; }.section-heading > p { max-width: 390px; margin: 0 0 4px; color: #9faac2; font-size: 15px; line-height: 1.85; }
.feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }.feature-card { position: relative; min-height: 310px; overflow: hidden; padding: 25px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(150deg, rgba(22, 34, 61, .75), rgba(12, 19, 37, .6)); transition: border-color .22s ease, transform .22s ease, background .22s ease; }.feature-card:hover { transform: translateY(-3px); border-color: rgba(146, 184, 255, .29); background: linear-gradient(150deg, rgba(27, 43, 79, .8), rgba(12, 19, 37, .7)); }.feature-card-wide { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; min-height: 272px; }.feature-index { display: block; margin: 18px 0 9px; color: #8a9cbe; font-size: 10px; font-weight: 750; letter-spacing: .14em; }.feature-copy { position: relative; z-index: 1; max-width: 440px; }.feature-card h3 { margin: 0 0 10px; font-size: 20px; font-weight: 640; letter-spacing: -.03em; }.feature-card p { max-width: 410px; margin: 0; color: #a3aec4; font-size: 14px; line-height: 1.8; }.feature-detail { display: inline-block; margin-top: 16px; color: #b8c7e8; font-size: 12px; }
.feature-icon { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgba(152, 180, 239, .18); border-radius: 12px; background: rgba(87, 122, 194, .13); color: #bcd1ff; font-size: 19px; }.icon-accounts { position: relative; display: flex; align-items: center; justify-content: center; gap: 3px; color: #b5ccff; }.icon-accounts i { width: 3px; height: 12px; border-radius: 2px; background: #73c8e8; }.icon-accounts i:nth-of-type(2) { height: 18px; background: #9f97f7; }.icon-accounts i:nth-of-type(3) { height: 15px; background: #83dec6; }.icon-drafts { color: #b7a7ff; background: rgba(124, 95, 205, .14); }.icon-publish { color: #a0e0df; background: rgba(65, 151, 153, .13); }.account-stack { display: flex; align-items: center; padding-right: 14px; }.account-stack span { display: grid; place-items: center; width: 42px; height: 42px; margin-left: -9px; border: 2px solid #111b32; border-radius: 14px; background: linear-gradient(145deg, #4884ba, #374275); color: #e4efff; font-size: 12px; font-weight: 750; box-shadow: 0 8px 20px #0004; }.account-stack span:nth-child(2) { background: linear-gradient(145deg, #b766a2, #534b91); }.account-stack span:nth-child(3) { background: linear-gradient(145deg, #47ae9d, #386c8d); }.account-stack span:nth-child(4) { background: rgba(133, 150, 192, .18); color: #c8d3ee; }
.file-preview { display: flex; align-items: center; gap: 12px; width: min(100%, 280px); margin-top: 26px; padding: 12px; border: 1px solid rgba(153, 172, 221, .13); border-radius: 12px; background: rgba(3, 9, 20, .3); }.file-glyph { display: grid; place-items: center; width: 34px; height: 39px; border: 1px solid rgba(174, 160, 255, .2); border-radius: 7px; background: rgba(127, 99, 213, .16); color: #c4b9ff; font-size: 8px; font-weight: 750; }.file-lines { display: grid; gap: 5px; flex: 1; }.file-lines i { width: 100%; height: 3px; border-radius: 4px; background: rgba(173, 189, 224, .2); }.file-lines i:nth-child(2) { width: 76%; }.file-lines i:nth-child(3) { width: 53%; }.file-lock { color: #91d8cc; font-size: 14px; }.publish-preview { display: flex; align-items: center; gap: 9px; margin-top: 30px; color: #b8c6e1; font-size: 11px; }.publish-preview > span { display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; border: 1px solid rgba(143, 168, 218, .16); border-radius: 8px; background: rgba(4, 11, 22, .25); }.publish-preview i { width: 5px; height: 5px; border-radius: 50%; background: #91aafa; }.publish-preview b { color: #88cfe1; }.feature-card-ai { border-color: rgba(121, 133, 219, .19); background: linear-gradient(110deg, rgba(41, 47, 99, .3), rgba(12, 21, 41, .65) 52%); }.feature-card-ai .feature-copy { max-width: 525px; }.ai-glow { display: grid; flex: 0 0 106px; place-items: center; width: 106px; height: 106px; margin: 0 8% 0 24px; border: 1px solid rgba(165, 155, 255, .3); border-radius: 28px; background: radial-gradient(circle at 35% 25%, rgba(158, 158, 255, .34), rgba(76, 76, 147, .15) 64%, rgba(28, 39, 78, .12)); box-shadow: 0 0 65px rgba(126, 109, 230, .17), inset 0 1px rgba(255, 255, 255, .13); color: #dad2ff; font-size: 20px; font-weight: 700; letter-spacing: .08em; }.provider-lines { display: grid; flex: 0 0 150px; gap: 8px; padding: 13px; border: 1px solid rgba(155, 177, 229, .18); border-radius: 12px; background: rgba(4, 10, 22, .42); }.provider-lines span { margin-bottom: 2px; color: #8796b5; font-size: 8px; letter-spacing: .1em; }.provider-lines i { height: 4px; border-radius: 4px; background: rgba(160, 181, 224, .18); }.provider-lines i:nth-of-type(2) { width: 72%; }.provider-lines i:nth-of-type(3) { width: 52%; }.provider-lines b { color: #8de0cb; font-size: 8px; letter-spacing: .08em; }

.workflow-section { border-block: 1px solid rgba(152, 175, 224, .09); background: linear-gradient(180deg, rgba(16, 27, 52, .39), rgba(10, 17, 32, .28)); }.workflow-heading { margin-bottom: 52px; }.workflow-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }.workflow-step { position: relative; min-height: 278px; padding: 24px 29px 22px; border-top: 1px solid rgba(155, 178, 228, .2); }.workflow-step + .workflow-step { border-left: 1px solid rgba(155, 178, 228, .12); }.step-number { position: absolute; top: 20px; right: 24px; color: #687693; font-size: 11px; letter-spacing: .12em; }.step-icon { position: relative; display: grid; place-items: center; width: 48px; height: 48px; margin: 4px 0 25px; border: 1px solid rgba(141, 182, 250, .24); border-radius: 15px; background: linear-gradient(145deg, rgba(85, 136, 208, .18), rgba(55, 78, 152, .13)); color: #bad3ff; font-size: 18px; }.step-icon::after { position: absolute; top: -5px; right: -5px; width: 7px; height: 7px; border: 2px solid #101a31; border-radius: 50%; background: #87ddce; content: ""; }.step-icon-two { border-color: rgba(177, 152, 250, .25); background: rgba(121, 94, 193, .14); color: #d1c2ff; }.step-icon-three { border-color: rgba(119, 206, 200, .25); background: rgba(61, 145, 146, .14); color: #a6e6dd; }.workflow-step h3 { margin: 0 0 9px; font-size: 18px; font-weight: 640; }.workflow-step p { max-width: 290px; margin-bottom: 21px; color: #9aa7c0; font-size: 14px; line-height: 1.8; }.step-foot { color: #8a9cbd; font-size: 12px; }

.privacy-section { padding-top: 104px; padding-bottom: 48px; }.privacy-panel { display: grid; grid-template-columns: .85fr 1.15fr; gap: 70px; padding: 52px; border: 1px solid rgba(119, 185, 218, .19); border-radius: 23px; background: radial-gradient(ellipse 53% 84% at 6% 50%, rgba(54, 122, 158, .16), transparent 84%), linear-gradient(140deg, rgba(13, 30, 47, .8), rgba(10, 17, 31, .9)); box-shadow: inset 0 1px rgba(255, 255, 255, .04); }.privacy-copy .eyebrow { margin-bottom: 18px; }.privacy-copy h2 { font-size: clamp(33px, 3.4vw, 43px); }.privacy-copy > p:not(.eyebrow) { max-width: 390px; margin: 19px 0 20px; color: #aab6ca; font-size: 14px; line-height: 1.85; }.text-link { display: inline-flex; align-items: center; gap: 10px; color: #bad4ff; font-size: 14px; font-weight: 650; }.text-link:hover { color: white; }.privacy-points { display: grid; align-content: center; }.privacy-points article { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 15px; padding: 20px 0; border-bottom: 1px solid rgba(163, 190, 222, .12); }.privacy-points article:first-child { border-top: 1px solid rgba(163, 190, 222, .12); }.privacy-number { align-self: start; padding-top: 3px; color: #80c8d5; font-size: 11px; letter-spacing: .08em; }.privacy-points h3 { margin: 0 0 4px; font-size: 15px; }.privacy-points p { margin: 0; color: #98a7bd; font-size: 13px; line-height: 1.7; }.privacy-state { color: #7e9eaa; font-size: 9px; font-weight: 700; letter-spacing: .1em; }.privacy-footnote { margin: 14px 0 0; color: #77839b; font-size: 12px; text-align: right; }

.plans-section { padding-top: 104px; padding-bottom: 104px; }.plans-heading { margin-bottom: 40px; }.plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; align-items: stretch; }.plan-card { position: relative; display: flex; flex-direction: column; min-width: 0; min-height: 485px; overflow: hidden; padding: 25px; border: 1px solid rgba(144, 165, 218, .2); border-radius: 18px; background: linear-gradient(155deg, rgba(22, 31, 59, .9), rgba(9, 15, 30, .94) 78%); box-shadow: inset 0 1px rgba(255, 255, 255, .035); }.plan-card::before { position: absolute; top: 0; right: 0; width: 150px; height: 120px; border-radius: 50%; background: rgba(102, 100, 209, .12); content: ""; filter: blur(50px); pointer-events: none; }.plan-standard::before { background: rgba(63, 156, 179, .13); }.plan-pro { border-color: rgba(116, 212, 209, .43); background: linear-gradient(155deg, rgba(16, 54, 66, .9), rgba(8, 23, 39, .95) 78%); box-shadow: inset 0 0 35px rgba(102, 218, 200, .045), 0 17px 50px rgba(6, 35, 49, .23); }.plan-pro::before { background: rgba(55, 174, 157, .16); }.plan-top { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; min-height: 24px; }.plan-code { color: #a9b5d6; font-size: 10px; font-weight: 800; letter-spacing: .18em; }.plan-mark { color: #667391; font-size: 11px; }.featured-label { padding: 5px 8px; border: 1px solid rgba(148, 220, 210, .23); border-radius: 999px; color: #b4e4da; font-size: 10px; }.plan-card h3 { position: relative; z-index: 1; margin: 17px 0 4px; font-size: 22px; font-weight: 650; }.plan-intro { min-height: 47px; margin-bottom: 14px; color: #9ba7c0; font-size: 13px; line-height: 1.7; }.plan-price { margin: 0; color: #f4f5ff; font-size: 43px; font-weight: 660; letter-spacing: -.06em; line-height: 1.16; }.currency { margin-right: 2px; color: #bdcbff; font-size: 25px; vertical-align: 8px; }.per-month { margin-left: 7px; color: #a3aec4; font-size: 13px; font-weight: 500; letter-spacing: 0; }.plan-billing { margin: 5px 0 18px; color: #909cb5; font-size: 12px; }.plan-rule { height: 1px; margin-bottom: 14px; background: rgba(154, 177, 224, .14); }.plan-features { display: grid; gap: 10px; margin: 0 0 23px; padding: 0; list-style: none; }.plan-features li { display: flex; align-items: center; gap: 9px; color: #c1c9dc; font-size: 13px; }.plan-features li > span { display: grid; flex: 0 0 19px; place-items: center; width: 19px; height: 19px; border: 1px solid rgba(139, 189, 223, .18); border-radius: 50%; background: rgba(93, 147, 183, .12); color: #a4e7dc; font-size: 10px; }.plan-features b { color: #eff2ff; font-weight: 700; }.plan-button { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 46px; margin-top: auto; padding: 0 15px; border: 1px solid rgba(147, 178, 232, .28); border-radius: 11px; background: rgba(38, 59, 101, .65); color: #e2eaff; font-size: 14px; font-weight: 680; transition: background .2s ease, border-color .2s ease, transform .2s ease; }.plan-button:hover { transform: translateY(-2px); border-color: rgba(173, 207, 255, .58); background: rgba(57, 83, 138, .78); }.plan-pro .plan-button { border-color: rgba(131, 225, 211, .42); background: rgba(39, 119, 115, .55); color: #e4fff9; }.plan-pro .plan-button:hover { background: rgba(44, 146, 134, .7); }.plan-note { max-width: 790px; margin: 22px auto 0; color: #8390aa; font-size: 13px; line-height: 1.75; text-align: center; }

.faq-section { display: grid; grid-template-columns: .7fr 1.3fr; gap: 80px; padding-top: 82px; padding-bottom: 116px; border-top: 1px solid rgba(152, 175, 224, .1); }.faq-intro .eyebrow { margin-bottom: 16px; }.faq-intro h2 { font-size: 38px; }.faq-intro > p:not(.eyebrow) { max-width: 260px; margin: 13px 0 19px; color: #9eabc4; font-size: 14px; line-height: 1.8; }.faq-list { border-top: 1px solid rgba(154, 177, 224, .17); }.faq-list details { border-bottom: 1px solid rgba(154, 177, 224, .17); }.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 68px; cursor: pointer; color: #e0e6f5; font-size: 15px; font-weight: 600; list-style: none; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary span { position: relative; flex: 0 0 20px; width: 20px; height: 20px; border: 1px solid rgba(151, 178, 229, .28); border-radius: 50%; }.faq-list summary span::before, .faq-list summary span::after { position: absolute; top: 8px; left: 5px; width: 8px; height: 1px; background: #b9c7e5; content: ""; }.faq-list summary span::after { transform: rotate(90deg); transition: transform .2s ease; }.faq-list details[open] summary span::after { transform: rotate(0); }.faq-list details p { max-width: 700px; margin: -2px 35px 20px 0; color: #9ba8bf; font-size: 14px; line-height: 1.85; }

.site-footer { border-top: 1px solid rgba(152, 175, 224, .13); background: rgba(4, 7, 15, .42); }.footer-main { display: flex; justify-content: space-between; gap: 60px; padding-top: 48px; padding-bottom: 43px; }.footer-brand-block > p { max-width: 270px; margin: 16px 0 0; color: #7f8aa2; font-size: 13px; }.footer-links { display: flex; gap: clamp(44px, 8vw, 105px); }.footer-links > div { display: grid; align-content: start; gap: 9px; }.footer-label { margin-bottom: 4px; color: #8d9ab6; font-size: 11px; font-weight: 750; letter-spacing: .08em; }.footer-links a { color: #aeb8ce; font-size: 13px; }.footer-links a:hover, .footer-bottom a:hover { color: #e2eaff; }.footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 25px; min-height: 58px; padding-top: 12px; padding-bottom: 12px; border-top: 1px solid rgba(152, 175, 224, .09); color: #78849c; font-size: 11px; }.footer-bottom > div { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }.footer-bottom a { color: #98a5bf; }.footer-separator { color: #53617b; }

@media (max-width: 1020px) {
  .hero { grid-template-columns: minmax(0, .83fr) minmax(400px, 1.17fr); gap: 9px; min-height: 660px; }
  h1 { font-size: clamp(41px, 5vw, 56px); }
  .hero-facts { gap: 16px; }
  .workspace-content { padding-inline: 14px; }
  .privacy-panel { gap: 38px; padding: 40px; }
  .faq-section { gap: 48px; }
}
@media (max-width: 800px) {
  .page-width { width: min(var(--content), calc(100% - 42px)); }
  .header-inner { min-height: 68px; }
  .menu-toggle { display: none; }
  .visual-orbit, .provider-lines { display: none; }
  .hero { grid-template-columns: 1fr; gap: 64px; min-height: 0; padding-top: 76px; padding-bottom: 95px; }
  .hero-copy { max-width: 650px; }
  h1 { max-width: none; font-size: clamp(46px, 8vw, 64px); }
  .hero-lede { max-width: 610px; }
  .hero-visual { width: min(100%, 670px); margin: auto; }
  .workspace-window { transform: none; }
  .scroll-cue { bottom: 29px; }
  .strip-inner { align-items: flex-start; flex-direction: column; justify-content: center; gap: 8px; padding-block: 15px; }
  .section { padding-top: 86px; padding-bottom: 86px; }
  .privacy-section { padding-top: 72px; padding-bottom: 35px; }
  .privacy-panel { grid-template-columns: 1fr; gap: 30px; }
  .privacy-copy { max-width: 600px; }
  .plans-section { padding-top: 85px; padding-bottom: 85px; }
  .faq-section { grid-template-columns: .8fr 1.2fr; gap: 28px; padding-top: 65px; padding-bottom: 86px; }
}
@media (max-width: 640px) {
  .page-width { width: calc(100% - 36px); }
  .header-inner { position: relative; min-height: 66px; }
  .brand { gap: 8px; }.brand img { width: 84px; height: 31px; }.brand-divider { height: 18px; }.brand-name { font-size: 12px; }
  .menu-toggle { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 42px; height: 42px; padding: 0 11px; border: 1px solid rgba(151, 175, 222, .2); border-radius: 12px; background: rgba(16, 26, 49, .8); cursor: pointer; }.menu-toggle span { width: 18px; height: 1px; background: #dce5fa; transition: transform .18s ease; }
  .has-js .site-nav { position: absolute; top: calc(100% + 1px); right: 0; left: 0; display: none; align-items: stretch; flex-direction: column; gap: 0; padding: 9px; border: 1px solid rgba(151, 175, 222, .2); border-radius: 0 0 15px 15px; background: rgba(8, 14, 29, .98); box-shadow: 0 22px 32px rgba(0, 0, 0, .35); }
  .has-js .site-nav.is-open { display: flex; }
  .site-nav > a:not(.nav-cta) { padding: 12px 11px; }.site-nav .nav-cta { justify-content: space-between; margin-top: 6px; border-radius: 10px; }
  .hero { gap: 51px; padding-top: 57px; padding-bottom: 84px; }
  .eyebrow { margin-bottom: 17px; font-size: 10px; }
  h1 { margin-bottom: 17px; font-size: clamp(39px, 10vw, 50px); letter-spacing: -.06em; }
  .hero-lede { margin-bottom: 23px; font-size: 15px; line-height: 1.82; }
  .hero-actions { gap: 9px; }.button { min-height: 47px; padding-inline: 15px; gap: 12px; font-size: 13px; }
  .hero-facts { gap: 12px 17px; margin-top: 31px; padding-top: 17px; }.hero-facts strong { font-size: 15px; }.hero-facts span { max-width: 120px; font-size: 11px; }
  .orbit-one { width: 370px; height: 370px; }.orbit-two { width: 305px; height: 305px; }
  .workspace-window { border-radius: 14px; }.window-topbar { min-height: 39px; padding-inline: 10px; }.window-controls { gap: 4px; }.window-controls i { width: 6px; height: 6px; }.window-title { margin-left: 10px; font-size: 9px; }.local-tag { padding: 3px 6px; font-size: 8px; }.local-tag i { width: 5px; height: 5px; }
  .workspace-rail { flex-basis: 37px; gap: 9px; padding-block: 11px; }.rail-logo { width: 22px; height: 22px; }.rail-logo img { width: 14px; height: 14px; }.rail-icon { width: 23px; height: 23px; font-size: 12px; }
  .workspace-content { padding: 13px 10px 9px; }.workspace-heading { margin-bottom: 11px; }.workspace-heading h2 { font-size: 15px; }.workspace-overline { font-size: 7px; }.period-pill { padding: 4px 6px; font-size: 8px; }.period-pill b { margin-left: 4px; }
  .metric-row { gap: 5px; }.metric-card { padding: 7px 6px; border-radius: 7px; }.metric-card > span:first-child { font-size: 7px; }.metric-card strong { font-size: 17px; }.metric-card strong small { font-size: 8px; }.metric-track { margin-top: 6px; }.metric-caption { font-size: 7px; }
  .workspace-lower { gap: 5px; margin-top: 6px; }.accounts-card, .draft-card { padding: 8px; border-radius: 8px; }.card-heading { margin-bottom: 5px; }.card-heading h3 { font-size: 10px; }.small-link { font-size: 7px; }.account-row { gap: 4px; padding: 6px 0; }.account-mark { flex-basis: 18px; width: 18px; height: 18px; border-radius: 6px; font-size: 7px; }.account-name b { max-width: 61px; font-size: 7px; }.account-name small { font-size: 6px; }.status-chip { gap: 3px; padding: 2px 4px; font-size: 6px; }.status-chip i { width: 3px; height: 3px; }.draft-orb { width: 25px; height: 25px; margin-bottom: 13px; border-radius: 8px; font-size: 13px; }.draft-card h3 { font-size: 10px; }.draft-card p { min-height: 36px; margin-bottom: 8px; font-size: 7px; }.draft-action { padding-top: 6px; font-size: 7px; }.mock-caption { font-size: 7px; }
  .float-note { gap: 7px; padding: 8px 9px; border-radius: 10px; }.float-note b { font-size: 9px; }.float-note small { font-size: 7px; }.note-icon, .api-spark { width: 23px; height: 23px; border-radius: 7px; font-size: 11px; }.api-spark { font-size: 8px; }.note-top { top: -17px; right: 9px; }.note-bottom { right: -4px; bottom: 1px; }
  .scroll-cue { bottom: 25px; font-size: 11px; }
  .strip-inner { gap: 6px; font-size: 12px; }.strip-items { gap: 9px; font-size: 11px; }
  .section { padding-top: 67px; padding-bottom: 67px; }.section-heading { align-items: flex-start; flex-direction: column; gap: 16px; margin-bottom: 28px; }.section-heading .eyebrow { margin-bottom: 12px; }.section-heading h2, .privacy-copy h2 { font-size: clamp(31px, 8vw, 39px); }.section-heading > p { font-size: 14px; }
  .feature-grid { grid-template-columns: 1fr; gap: 10px; }.feature-card, .feature-card-wide { min-height: 0; padding: 20px; }.feature-card-wide { align-items: flex-start; flex-direction: column; gap: 20px; }.feature-card h3 { font-size: 18px; }.feature-card p { font-size: 13px; }.feature-detail { font-size: 11px; }.account-stack { align-self: flex-end; margin-top: -12px; }.account-stack span { width: 35px; height: 35px; border-radius: 11px; }.file-preview { margin-top: 18px; }.publish-preview { margin-top: 19px; }.feature-card-ai { flex-direction: column; }.feature-card-ai .feature-copy { order: 0; }.ai-glow { position: absolute; right: 24px; bottom: 20px; width: 62px; height: 62px; margin: 0; border-radius: 19px; font-size: 14px; }.provider-lines { display: none; }
  .workflow-heading { margin-bottom: 30px; }.workflow-grid { grid-template-columns: 1fr; }.workflow-step { min-height: 0; padding: 19px 2px 22px 0; }.workflow-step + .workflow-step { border-left: 0; }.step-number { top: 20px; right: 4px; }.step-icon { width: 42px; height: 42px; margin-bottom: 18px; border-radius: 13px; }.workflow-step h3 { font-size: 17px; }.workflow-step p { max-width: 100%; margin-bottom: 10px; font-size: 13px; }
  .privacy-section { padding-top: 58px; padding-bottom: 27px; }.privacy-panel { gap: 25px; padding: 25px 19px; border-radius: 17px; }.privacy-copy h2 { font-size: 32px; }.privacy-copy > p:not(.eyebrow) { margin: 14px 0 16px; font-size: 13px; }.privacy-points article { grid-template-columns: 25px 1fr; gap: 10px; padding: 16px 0; }.privacy-state { grid-column: 2; font-size: 8px; }.privacy-number { font-size: 10px; }.privacy-points h3 { font-size: 14px; }.privacy-points p { font-size: 12px; }.privacy-footnote { font-size: 11px; text-align: left; }
  .plans-section { padding-top: 70px; padding-bottom: 70px; }.plans-heading { margin-bottom: 26px; }.plan-grid { grid-template-columns: 1fr; gap: 11px; }.plan-card { min-height: 0; padding: 22px; }.plan-intro { min-height: 0; margin-bottom: 13px; }.plan-price { font-size: 40px; }.plan-features { gap: 9px; margin-bottom: 19px; }.plan-note { margin-top: 17px; font-size: 12px; text-align: left; }
  .faq-section { grid-template-columns: 1fr; gap: 28px; padding-top: 60px; padding-bottom: 70px; }.faq-intro h2 { font-size: 34px; }.faq-intro > p:not(.eyebrow) { max-width: 350px; }.faq-list summary { min-height: 62px; font-size: 14px; }.faq-list details p { margin-right: 20px; font-size: 13px; }
  .footer-main { flex-direction: column; gap: 30px; padding-top: 34px; padding-bottom: 30px; }.footer-links { justify-content: space-between; gap: 20px; }.footer-links > div { gap: 8px; }.footer-links a { font-size: 12px; }.footer-bottom { align-items: flex-start; flex-direction: column; gap: 8px; padding-block: 14px; font-size: 10px; }.footer-bottom > div { gap: 7px; }
}
@media (max-width: 380px) {
  .page-width { width: calc(100% - 28px); }
  .brand img { width: 73px; }.brand-name { font-size: 11px; }.hero-facts { gap: 10px; }.hero-facts span { max-width: 95px; font-size: 10px; }
  .workspace-rail { flex-basis: 32px; }.workspace-content { padding-inline: 7px; }.account-name b { max-width: 49px; }.status-chip { padding-inline: 3px; }.strip-items { gap: 6px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

.nav-tools { display: flex; align-items: center; gap: 8px; }
.utility-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px; padding: 0 11px; border: 1px solid var(--line-strong); border-radius: 999px; background: var(--surface-soft); color: var(--text); font-size: 12px; font-weight: 700; white-space: nowrap; cursor: pointer; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.utility-toggle:hover { transform: translateY(-1px); border-color: var(--blue); }
.utility-icon { font-size: 16px; line-height: 1; }
.language-toggle { min-width: 48px; }

@media (max-width: 640px) {
  .site-nav .nav-tools { justify-content: flex-start; padding: 12px 11px 6px; }
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f7fb;
  --bg-deep: #eaf0f7;
  --surface: #ffffff;
  --surface-soft: #edf2f8;
  --line: rgba(38, 57, 84, .13);
  --line-strong: rgba(38, 57, 84, .24);
  --text: #17243a;
  --muted: #53627a;
  --quiet: #718098;
  --blue: #4774c3;
  --cyan: #25869a;
  --violet: #7466c6;
  --mint: #208c75;
}

:root[data-theme="light"] body { background: var(--bg); color: var(--text); }
:root[data-theme="light"] body::before { background: radial-gradient(ellipse 54% 46% at 88% 2%, rgba(97, 139, 216, .12), transparent 74%), radial-gradient(ellipse 40% 34% at 10% 18%, rgba(67, 163, 181, .08), transparent 75%), linear-gradient(180deg, #f8faff 0%, #f4f7fb 64%, #eef3f8 100%); }
:root[data-theme="light"] .site-header { border-color: rgba(49, 71, 104, .12); background: rgba(248, 250, 254, .9); }
:root[data-theme="light"] .brand-name { color: #52617a; }
:root[data-theme="light"] .brand img { filter: brightness(0) saturate(100%) invert(18%) sepia(23%) saturate(1384%) hue-rotate(182deg) brightness(94%) contrast(92%); }
:root[data-theme="light"] .brand-divider { background: rgba(53, 73, 104, .2); }
:root[data-theme="light"] .site-nav { color: #53627a; }
:root[data-theme="light"] .site-nav > a:not(.nav-cta) { color: #53627a; }
:root[data-theme="light"] .site-nav > a:not(.nav-cta):hover { color: #14233b; }
:root[data-theme="light"] .nav-cta { border-color: rgba(74, 117, 196, .28); background: rgba(100, 142, 218, .1); color: #284b85; }
:root[data-theme="light"] .nav-cta:hover { border-color: rgba(74, 117, 196, .55); background: rgba(100, 142, 218, .17); }
:root[data-theme="light"] .menu-toggle { border-color: rgba(49, 71, 104, .2); background: rgba(255, 255, 255, .85); }
:root[data-theme="light"] .menu-toggle span { background: #34445e; }
:root[data-theme="light"] h1 span,
:root[data-theme="light"] .section-heading h2 span,
:root[data-theme="light"] .privacy-copy h2 span { color: #546eb5; }
:root[data-theme="light"] .eyebrow { color: #5d6d87; }
:root[data-theme="light"] .hero-lede { color: #52617a; }
:root[data-theme="light"] .button-quiet { border-color: rgba(55, 77, 109, .22); background: rgba(255, 255, 255, .78); color: #344660; }
:root[data-theme="light"] .button-quiet:hover { border-color: rgba(65, 105, 174, .4); background: #fff; }
:root[data-theme="light"] .download-note { color: #687791; }
:root[data-theme="light"] .download-note strong { color: #324967; }
:root[data-theme="light"] .hero-facts { border-color: rgba(49, 71, 104, .14); }
:root[data-theme="light"] .hero-facts strong { color: #21324c; }
:root[data-theme="light"] .hero-facts span { color: #677790; }
:root[data-theme="light"] .float-note { border-color: rgba(53, 79, 116, .16); background: rgba(255, 255, 255, .92); box-shadow: 0 18px 45px rgba(38, 57, 84, .12); }
:root[data-theme="light"] .float-note b { color: #263851; }
:root[data-theme="light"] .float-note small { color: #6b7890; }
:root[data-theme="light"] .workspace-window { color: #dce5f8; }
:root[data-theme="light"] .capability-strip { border-color: rgba(49, 71, 104, .11); background: rgba(232, 239, 248, .72); }
:root[data-theme="light"] .strip-inner { color: #53627a; }
:root[data-theme="light"] .strip-items { color: #687791; }
:root[data-theme="light"] .feature-card { border-color: rgba(49, 71, 104, .14); background: linear-gradient(145deg, rgba(255, 255, 255, .97), rgba(242, 246, 251, .96)); box-shadow: 0 15px 38px rgba(40, 60, 91, .07), inset 0 1px #fff; }
:root[data-theme="light"] .feature-card h3 { color: #1e2f48; }
:root[data-theme="light"] .feature-card p { color: #53627a; }
:root[data-theme="light"] .feature-index,
:root[data-theme="light"] .feature-detail { color: #667791; }
:root[data-theme="light"] .feature-card-ai { border-color: rgba(93, 106, 184, .18); background: linear-gradient(110deg, rgba(231, 235, 255, .94), rgba(247, 249, 253, .98) 58%); }
:root[data-theme="light"] .file-preview,
:root[data-theme="light"] .publish-preview { border-color: rgba(49, 71, 104, .14); background: rgba(231, 238, 247, .78); color: #50627d; }
:root[data-theme="light"] .file-lines i { background: rgba(63, 86, 123, .2); }
:root[data-theme="light"] .workflow-section { border-color: rgba(49, 71, 104, .12); background: linear-gradient(180deg, rgba(233, 240, 248, .85), rgba(244, 247, 251, .74)); }
:root[data-theme="light"] .workflow-step { border-color: rgba(49, 71, 104, .17); }
:root[data-theme="light"] .step-number { color: #78869b; }
:root[data-theme="light"] .step-icon::after { border-color: #eef3f8; }
:root[data-theme="light"] .workflow-step p { color: #53627a; }
:root[data-theme="light"] .step-foot { color: #65758f; }
:root[data-theme="light"] .privacy-panel { border-color: rgba(62, 126, 151, .2); background: radial-gradient(ellipse 53% 84% at 6% 50%, rgba(89, 165, 183, .12), transparent 84%), linear-gradient(140deg, rgba(255, 255, 255, .98), rgba(237, 244, 248, .98)); box-shadow: 0 20px 50px rgba(38, 57, 84, .07), inset 0 1px #fff; }
:root[data-theme="light"] .privacy-copy > p:not(.eyebrow) { color: #53627a; }
:root[data-theme="light"] .text-link { color: #345c9c; }
:root[data-theme="light"] .text-link:hover { color: #1d3f77; }
:root[data-theme="light"] .privacy-points article { border-color: rgba(49, 71, 104, .13); }
:root[data-theme="light"] .privacy-points h3 { color: #243650; }
:root[data-theme="light"] .privacy-points p { color: #596981; }
:root[data-theme="light"] .privacy-state { color: #587983; }
:root[data-theme="light"] .privacy-footnote { color: #687791; }
:root[data-theme="light"] .plan-card { border-color: rgba(49, 71, 104, .16); background: linear-gradient(155deg, #fff, #f0f4fa 85%); box-shadow: 0 16px 38px rgba(40, 60, 91, .08), inset 0 1px #fff; }
:root[data-theme="light"] .plan-pro { border-color: rgba(38, 142, 125, .35); background: linear-gradient(155deg, #f2fffb, #e9f5f3 85%); }
:root[data-theme="light"] .plan-code { color: #586a86; }
:root[data-theme="light"] .plan-mark { color: #7a879d; }
:root[data-theme="light"] .featured-label { border-color: rgba(38, 142, 125, .28); color: #287b6d; }
:root[data-theme="light"] .plan-card h3 { color: #20324d; }
:root[data-theme="light"] .plan-intro,
:root[data-theme="light"] .per-month,
:root[data-theme="light"] .plan-billing { color: #64738a; }
:root[data-theme="light"] .plan-price { color: #192b44; }
:root[data-theme="light"] .currency { color: #526aa8; }
:root[data-theme="light"] .plan-rule { background: rgba(49, 71, 104, .14); }
:root[data-theme="light"] .plan-features li { color: #43536c; }
:root[data-theme="light"] .plan-features li > span { border-color: rgba(61, 111, 148, .2); background: rgba(76, 143, 164, .1); color: #267c6d; }
:root[data-theme="light"] .plan-features b { color: #20324d; }
:root[data-theme="light"] .plan-button { border-color: rgba(65, 105, 174, .27); background: rgba(98, 136, 199, .11); color: #294b7e; }
:root[data-theme="light"] .plan-button:hover { border-color: rgba(65, 105, 174, .5); background: rgba(98, 136, 199, .18); }
:root[data-theme="light"] .plan-pro .plan-button { border-color: rgba(38, 142, 125, .34); background: rgba(49, 160, 139, .13); color: #23685f; }
:root[data-theme="light"] .plan-note { color: #61718a; }
:root[data-theme="light"] .faq-section { border-color: rgba(49, 71, 104, .13); }
:root[data-theme="light"] .faq-intro > p:not(.eyebrow) { color: #53627a; }
:root[data-theme="light"] .faq-list,
:root[data-theme="light"] .faq-list details { border-color: rgba(49, 71, 104, .16); }
:root[data-theme="light"] .faq-list summary { color: #263851; }
:root[data-theme="light"] .faq-list summary span { border-color: rgba(49, 71, 104, .25); }
:root[data-theme="light"] .faq-list summary span::before,
:root[data-theme="light"] .faq-list summary span::after { background: #52627a; }
:root[data-theme="light"] .faq-list details p { color: #53627a; }
:root[data-theme="light"] .site-footer { border-color: rgba(49, 71, 104, .15); background: rgba(233, 239, 247, .84); }
:root[data-theme="light"] .footer-brand-block > p { color: #65738a; }
:root[data-theme="light"] .footer-label { color: #52637d; }
:root[data-theme="light"] .footer-links a { color: #43536b; }
:root[data-theme="light"] .footer-links a:hover,
:root[data-theme="light"] .footer-bottom a:hover { color: #19375f; }
:root[data-theme="light"] .footer-bottom { border-color: rgba(49, 71, 104, .12); color: #64728a; }
:root[data-theme="light"] .footer-bottom a { color: #465a78; }
:root[data-theme="light"] .footer-separator { color: #8996a9; }
:root[data-theme="light"] .utility-toggle { border-color: rgba(49, 71, 104, .22); background: rgba(255, 255, 255, .82); color: #344660; }
:root[data-theme="light"] .utility-toggle:hover { border-color: #5579bd; background: #fff; }

@media (max-width: 900px) {
  .header-inner { position: relative; }
  .menu-toggle { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 42px; height: 42px; padding: 0 11px; border: 1px solid rgba(151, 175, 222, .2); border-radius: 12px; background: rgba(16, 26, 49, .8); cursor: pointer; }
  .menu-toggle span { width: 18px; height: 1px; background: #dce5fa; transition: transform .18s ease; }
  .has-js .site-nav { position: absolute; top: calc(100% + 1px); right: 0; left: auto; display: none; align-items: stretch; flex-direction: column; gap: 0; width: min(360px, calc(100vw - 28px)); padding: 9px; border: 1px solid rgba(151, 175, 222, .2); border-radius: 0 0 15px 15px; background: rgba(8, 14, 29, .98); box-shadow: 0 22px 32px rgba(0, 0, 0, .35); }
  .has-js .site-nav.is-open { display: flex; }
  .site-nav > a:not(.nav-cta) { padding: 12px 11px; }
  .site-nav .nav-cta { justify-content: space-between; margin-top: 6px; border-radius: 10px; }
  .site-nav .nav-tools { justify-content: flex-start; padding: 12px 11px 6px; }
  :root[data-theme="light"] .menu-toggle { border-color: rgba(49, 71, 104, .2); background: rgba(255, 255, 255, .85); }
  :root[data-theme="light"] .menu-toggle span { background: #34445e; }
  :root[data-theme="light"] .has-js .site-nav { border-color: rgba(49, 71, 104, .16); background: rgba(250, 252, 255, .98); box-shadow: 0 22px 32px rgba(30, 46, 73, .13); }
}

:root[lang="en"] h1 { font-size: clamp(40px, 4.8vw, 60px); }
@media (max-width: 800px) {
  :root[lang="en"] h1 { font-size: clamp(40px, 8vw, 60px); }
}
@media (max-width: 640px) {
  :root[lang="en"] h1 { font-size: clamp(38px, 9vw, 48px); }
}

/* Software interface preview */
.product-preview-section { padding-top: 104px; padding-bottom: 112px; }
.product-preview-heading { margin-bottom: 37px; }
.software-preview-shell { overflow: hidden; border: 1px solid rgba(143, 173, 231, .24); border-radius: 22px; background: linear-gradient(145deg, rgba(14, 25, 51, .97), rgba(7, 13, 28, .98)); box-shadow: 0 30px 80px rgba(0, 0, 0, .3), inset 0 1px rgba(255, 255, 255, .055); }
.software-preview-topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 58px; padding: 0 20px; border-bottom: 1px solid rgba(151, 175, 222, .12); background: rgba(255, 255, 255, .018); }
.software-preview-brand { display: inline-flex; align-items: center; gap: 10px; }
.software-preview-brand > span:last-child { display: grid; gap: 1px; }
.software-preview-brand b { color: #edf3ff; font-size: 12px; letter-spacing: .08em; }
.software-preview-brand small { color: #7483a4; font-size: 8px; font-weight: 750; letter-spacing: .15em; }
.software-preview-logo { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid rgba(160, 191, 255, .38); border-radius: 9px; background: linear-gradient(145deg, #5d81d1, #6957ad); color: #f2f5ff; font-size: 13px; font-weight: 800; box-shadow: 0 6px 17px rgba(64, 87, 176, .27); }
.software-preview-topbar-meta { display: inline-flex; align-items: center; gap: 17px; color: #9aa9c7; font-size: 10px; }
.preview-sync { display: inline-flex; align-items: center; gap: 6px; color: #a8dccc; }
.preview-sync i, .preview-running i { width: 6px; height: 6px; border-radius: 50%; background: #78ddbd; box-shadow: 0 0 9px rgba(120, 221, 189, .76); }
.preview-window-dots { display: inline-flex; gap: 5px; }
.preview-window-dots i { width: 5px; height: 5px; border-radius: 50%; background: #596783; }
.software-preview-body { display: flex; min-height: 486px; }
.software-preview-sidebar { display: flex; flex: 0 0 165px; flex-direction: column; gap: 6px; padding: 22px 13px 16px; border-right: 1px solid rgba(151, 175, 222, .11); background: rgba(2, 7, 18, .2); }
.preview-sidebar-label { margin: 0 10px 8px; color: #7384a8; font-size: 9px; font-weight: 800; letter-spacing: .14em; }
.preview-nav-item { display: flex; align-items: center; gap: 10px; min-height: 36px; padding: 0 10px; border: 1px solid transparent; border-radius: 9px; color: #8291b1; font-size: 11px; transition: background .2s ease, border-color .2s ease, color .2s ease; }
.preview-nav-item > span { display: grid; place-items: center; width: 19px; color: #7685a5; font-size: 14px; }
.preview-nav-item.active { border-color: rgba(132, 168, 249, .23); background: rgba(102, 143, 237, .16); color: #d2e1ff; }
.preview-nav-item.active > span { color: #a4c7ff; }
.preview-nav-item:hover { border-color: rgba(132, 168, 249, .22); background: rgba(102, 143, 237, .11); color: #e4ecff; }
.preview-sidebar-spacer { flex: 1; }
.software-preview-main { flex: 1; min-width: 0; padding: 28px 31px 17px; }
.software-main-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; margin-bottom: 18px; }
.preview-kicker { display: block; color: #7789ac; font-size: 9px; font-weight: 800; letter-spacing: .13em; line-height: 1.4; }
.software-main-head h3 { margin: 5px 0 0; color: #eef3ff; font-size: 23px; font-weight: 650; letter-spacing: -.04em; }
.preview-connect { min-height: 35px; padding: 0 13px; border: 1px solid rgba(139, 183, 255, .4); border-radius: 9px; background: rgba(83, 128, 222, .18); color: #cde1ff; font-size: 11px; font-weight: 700; cursor: default; }
.preview-mode-tabs { display: flex; align-items: center; gap: 5px; min-height: 37px; padding: 4px; border: 1px solid rgba(151, 175, 222, .13); border-radius: 10px; background: rgba(255, 255, 255, .025); }
.preview-mode-tabs > span { display: inline-flex; align-items: center; min-height: 27px; padding: 0 11px; border-radius: 7px; color: #8291ae; font-size: 10px; }
.preview-mode-tabs > span.active { background: rgba(108, 150, 238, .18); color: #d3e3ff; }
.preview-mode-tabs .preview-tab-count { margin-left: auto; color: #8190ac; }
.preview-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-top: 12px; }
.preview-metrics > div { min-width: 0; padding: 12px 13px 10px; border: 1px solid rgba(151, 175, 222, .13); border-radius: 10px; background: rgba(255, 255, 255, .024); }
.preview-metrics span { display: block; color: #8b9ab7; font-size: 9px; }
.preview-metrics strong { display: block; margin-top: 2px; color: #edf2ff; font-size: 26px; font-weight: 630; letter-spacing: -.04em; line-height: 1.3; }
.preview-metrics small { color: #7583a2; font-size: 8px; }
.preview-columns { display: grid; grid-template-columns: 1.05fr .95fr; gap: 10px; margin-top: 12px; }
.preview-table-card, .preview-ai-card { min-width: 0; padding: 15px 15px 13px; border: 1px solid rgba(151, 175, 222, .13); border-radius: 12px; background: rgba(255, 255, 255, .025); }
.preview-ai-card { border-color: rgba(122, 201, 191, .17); background: linear-gradient(145deg, rgba(34, 74, 91, .22), rgba(255, 255, 255, .022)); }
.preview-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 13px; }
.preview-card-head h4 { margin: 4px 0 0; color: #e2eafc; font-size: 14px; font-weight: 650; }
.preview-card-head > a { margin-top: 4px; color: #9bb9ed; font-size: 9px; white-space: nowrap; }
.preview-card-head > a b { margin-left: 4px; }
.preview-running { display: inline-flex; align-items: center; gap: 6px; padding: 4px 7px; border: 1px solid rgba(120, 221, 189, .2); border-radius: 999px; color: #a4e2d0; font-size: 9px; white-space: nowrap; }
.preview-running i { width: 5px; height: 5px; }
.preview-table-labels, .preview-table-row { display: grid; grid-template-columns: minmax(0, 1fr) 57px 30px; align-items: center; gap: 7px; }
.preview-table-labels { padding: 0 3px 8px; color: #7383a2; font-size: 8px; }
.preview-table-row { min-height: 47px; border-top: 1px solid rgba(151, 175, 222, .09); }
.preview-platform { display: grid; grid-template-columns: 23px minmax(0, 1fr); align-items: center; column-gap: 7px; min-width: 0; }
.platform-logo { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 7px; color: #e9f2ff; font-size: 11px; font-style: normal; font-weight: 760; }
.logo-x { background: linear-gradient(145deg, #455a85, #202c4c); }.logo-instagram { background: linear-gradient(145deg, #c374b9, #5e55a7); }.logo-youtube { background: linear-gradient(145deg, #e15e67, #963f64); }.logo-tiktok { background: linear-gradient(145deg, #4abac7, #324f8a); }
.preview-platform b { overflow: hidden; color: #d9e3f7; font-size: 9px; font-weight: 620; text-overflow: ellipsis; white-space: nowrap; }
.preview-platform small { grid-column: 2; overflow: hidden; color: #7584a3; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.preview-status { display: inline-flex; align-items: center; gap: 5px; color: #9adbc8; font-size: 8px; white-space: nowrap; }
.preview-status i { width: 5px; height: 5px; border-radius: 50%; background: #78ddb9; box-shadow: 0 0 7px rgba(120, 221, 185, .62); }
.preview-status-warn { color: #e6c993; }.preview-status-warn i { background: #e7bc64; box-shadow: 0 0 7px rgba(231, 188, 100, .56); }
.preview-table-row > a { color: #9cb8e7; font-size: 8px; text-align: right; }
.preview-ai-summary { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; }
.preview-ai-summary strong { display: block; color: #e3f4f2; font-size: 17px; font-weight: 650; letter-spacing: -.03em; }
.preview-ai-summary small { display: block; margin-top: 2px; color: #7896a3; font-size: 8px; }
.preview-ai-summary > span { color: #b4ecdc; font-size: 19px; font-weight: 650; text-align: right; }
.preview-ai-summary > span small { color: #7896a3; font-size: 8px; font-weight: 500; }
.preview-progress { height: 5px; margin: 15px 0 12px; overflow: hidden; border-radius: 5px; background: rgba(146, 194, 203, .14); }
.preview-progress i { display: block; width: 68%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #65c8d0, #95e0bf); }
.preview-step-list { display: grid; gap: 8px; }
.preview-step-list > div { display: grid; grid-template-columns: 17px 1fr auto; align-items: center; gap: 7px; color: #acbdc7; font-size: 9px; }
.preview-step-list b { color: #75919e; font-size: 8px; font-weight: 500; }
.preview-step-state { display: grid; place-items: center; width: 16px; height: 16px; border-radius: 5px; color: #07191e; font-size: 9px; font-weight: 800; }
.preview-step-state.done { background: #8adac2; }.preview-step-state.active { background: #a9a2ef; color: #1b183b; }
.preview-queue { margin-top: 17px; padding-top: 12px; border-top: 1px solid rgba(141, 199, 198, .14); }
.preview-queue-head, .preview-queue-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.preview-queue-head { margin-bottom: 8px; color: #8ba4ac; font-size: 9px; }.preview-queue-head > span:last-child { color: #a8d8d6; font-size: 8px; }.preview-queue-head b { margin-left: 3px; }
.preview-queue-row { min-height: 27px; border-top: 1px solid rgba(141, 199, 198, .09); color: #a2b7bd; font-size: 8px; }
.preview-queue-row > span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.preview-queue-row b { color: #7e9aa4; font-size: 8px; font-weight: 500; }
.queue-dot { flex: 0 0 5px; width: 5px; height: 5px; margin-right: -3px; border-radius: 50%; }.queue-blue { background: #88b8fc; }.queue-mint { background: #7edbc1; }
.software-preview-note { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 11px; color: #7787a6; font-size: 9px; }
.software-preview-note > span:first-child { display: inline-flex; align-items: center; gap: 6px; }.software-preview-note > span:first-child i { width: 5px; height: 5px; border-radius: 50%; background: #a79bf8; }
.software-preview-note > span:last-child { color: #9bb9ed; }.software-preview-note b { margin-left: 4px; }

:root[data-theme="light"] .software-preview-shell { border-color: rgba(49, 71, 104, .2); background: linear-gradient(145deg, #172641, #0e1b33 80%); box-shadow: 0 25px 56px rgba(40, 60, 91, .14), inset 0 1px rgba(255,255,255,.08); }
:root[data-theme="light"] .software-preview-sidebar { border-color: rgba(166, 190, 230, .15); background: rgba(4, 10, 23, .18); }
:root[data-theme="light"] .software-preview-topbar { border-color: rgba(166, 190, 230, .15); }
:root[data-theme="light"] .software-preview-brand b, :root[data-theme="light"] .software-main-head h3, :root[data-theme="light"] .preview-card-head h4, :root[data-theme="light"] .preview-metrics strong { color: #eef4ff; }
:root[data-theme="light"] .preview-mode-tabs, :root[data-theme="light"] .preview-metrics > div, :root[data-theme="light"] .preview-table-card, :root[data-theme="light"] .preview-ai-card { border-color: rgba(177, 199, 235, .18); background-color: rgba(255,255,255,.045); }
:root[data-theme="light"] .preview-nav-item { color: #9baeca; }
:root[data-theme="light"] .preview-nav-item.active { color: #d6e5ff; }
:root[data-theme="light"] .preview-platform b { color: #e2eafe; }
:root[data-theme="light"] .preview-platform small, :root[data-theme="light"] .preview-metrics small, :root[data-theme="light"] .preview-table-labels { color: #8fa4c3; }

@media (max-width: 900px) {
  .software-preview-sidebar { flex-basis: 136px; }
  .software-preview-main { padding-inline: 20px; }
  .preview-columns { grid-template-columns: 1fr; }
  .preview-ai-card { min-height: 290px; }
}
@media (max-width: 640px) {
  .product-preview-section { padding-top: 68px; padding-bottom: 72px; }
  .software-preview-topbar { min-height: 51px; padding-inline: 13px; }
  .software-preview-topbar-meta { gap: 8px; font-size: 8px; }
  .preview-window-dots { display: none; }
  .software-preview-body { min-height: 0; }
  .software-preview-sidebar { flex-basis: 49px; gap: 8px; padding: 14px 6px; }
  .preview-sidebar-label { display: none; }
  .preview-nav-item { justify-content: center; min-height: 31px; padding: 0; }
  .preview-nav-item > span { width: auto; font-size: 14px; }
  .preview-nav-item { font-size: 0; }
  .software-preview-main { padding: 18px 11px 13px; }
  .software-main-head { margin-bottom: 12px; }
  .software-main-head h3 { font-size: 18px; }
  .preview-kicker { font-size: 7px; }
  .preview-connect { min-height: 31px; padding-inline: 8px; font-size: 9px; }
  .preview-mode-tabs { min-height: 33px; }
  .preview-mode-tabs > span { min-height: 24px; padding-inline: 7px; font-size: 8px; }
  .preview-mode-tabs .preview-tab-count { display: none; }
  .preview-metrics { gap: 5px; margin-top: 8px; }
  .preview-metrics > div { padding: 8px 7px; }.preview-metrics span { font-size: 7px; }.preview-metrics strong { font-size: 20px; }.preview-metrics small { font-size: 7px; }
  .preview-columns { gap: 7px; margin-top: 8px; }
  .preview-table-card, .preview-ai-card { padding: 11px 9px 10px; border-radius: 9px; }
  .preview-card-head { margin-bottom: 9px; }.preview-card-head h4 { font-size: 12px; }.preview-card-head > a { font-size: 8px; }
  .preview-table-labels, .preview-table-row { grid-template-columns: minmax(0, 1fr) 46px 24px; gap: 4px; }.preview-table-labels { padding-bottom: 5px; font-size: 7px; }.preview-table-row { min-height: 39px; }
  .platform-logo { width: 19px; height: 19px; font-size: 9px; }.preview-platform { grid-template-columns: 19px minmax(0,1fr); column-gap: 5px; }.preview-platform b { font-size: 8px; }.preview-platform small { font-size: 7px; }.preview-status { gap: 3px; font-size: 7px; }.preview-status i { width: 4px; height: 4px; }.preview-table-row > a { font-size: 7px; }
  .preview-ai-summary strong { font-size: 15px; }.preview-ai-summary > span { font-size: 16px; }.preview-ai-summary small, .preview-ai-summary > span small { font-size: 7px; }.preview-progress { margin: 11px 0 9px; }.preview-step-list { gap: 6px; }.preview-step-list > div { grid-template-columns: 14px 1fr auto; gap: 5px; font-size: 8px; }.preview-step-state { width: 14px; height: 14px; font-size: 8px; }.preview-step-list b { font-size: 7px; }
  .preview-queue { margin-top: 12px; padding-top: 9px; }.preview-queue-head { font-size: 8px; }.preview-queue-head > span:last-child { font-size: 7px; }.preview-queue-row { min-height: 23px; font-size: 7px; }.preview-queue-row b { font-size: 7px; }
  .software-preview-note { margin-top: 8px; font-size: 7px; }
}

/* Platform showcase */
.platform-showcase-section { padding-top: 96px; padding-bottom: 103px; }
.platform-showcase-heading { margin-bottom: 34px; }
.platform-showcase-groups { display: grid; gap: 14px; }
.platform-showcase-group { padding: 24px; border: 1px solid rgba(143, 173, 231, .2); border-radius: 18px; background: linear-gradient(145deg, rgba(17, 30, 58, .72), rgba(9, 16, 32, .65)); box-shadow: inset 0 1px rgba(255, 255, 255, .03); }
.platform-group-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 17px; }
.platform-group-kicker { display: block; color: #7f90b1; font-size: 9px; font-weight: 800; letter-spacing: .14em; }
.platform-group-heading h3 { margin: 4px 0 0; color: #e9efff; font-size: 20px; font-weight: 650; letter-spacing: -.035em; }
.platform-group-count { padding: 5px 9px; border: 1px solid rgba(142, 179, 234, .19); border-radius: 999px; color: #a4b7db; font-size: 10px; white-space: nowrap; }
.platform-logo-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; }
.platform-logo-card { display: grid; grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; column-gap: 9px; min-width: 0; min-height: 67px; padding: 11px 12px; border: 1px solid rgba(145, 175, 226, .14); border-radius: 11px; background: rgba(6, 13, 28, .43); transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.platform-logo-card:hover { transform: translateY(-2px); border-color: rgba(142, 186, 255, .42); background: rgba(41, 65, 114, .42); }
.platform-logo-card img { grid-row: 1 / span 2; width: 34px; height: 34px; object-fit: contain; }
.platform-logo-card span { overflow: hidden; color: #dfe8fb; font-size: 12px; font-weight: 650; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.platform-logo-card small { overflow: hidden; color: #7e8eaa; font-size: 8px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.platform-showcase-note { margin: 14px 0 0; color: #7f8eaa; font-size: 11px; text-align: right; }

:root[data-theme="light"] .platform-showcase-group { border-color: rgba(49, 71, 104, .15); background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(239,245,251,.96)); box-shadow: 0 13px 31px rgba(40,60,91,.06), inset 0 1px #fff; }
:root[data-theme="light"] .platform-group-kicker { color: #667892; }
:root[data-theme="light"] .platform-group-heading h3 { color: #21334f; }
:root[data-theme="light"] .platform-group-count { border-color: rgba(49, 71, 104, .15); color: #586c89; }
:root[data-theme="light"] .platform-logo-card { border-color: rgba(49, 71, 104, .13); background: rgba(239,244,250,.82); }
:root[data-theme="light"] .platform-logo-card:hover { border-color: rgba(74,117,196,.36); background: #fff; }
:root[data-theme="light"] .platform-logo-card span { color: #263b59; }
:root[data-theme="light"] .platform-logo-card small { color: #71819a; }
:root[data-theme="light"] .platform-showcase-note { color: #687994; }

@media (max-width: 1020px) {
  .platform-logo-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .platform-showcase-section { padding-top: 68px; padding-bottom: 72px; }
  .platform-showcase-heading { margin-bottom: 27px; }
  .platform-showcase-group { padding: 17px 13px; border-radius: 14px; }
  .platform-group-heading { margin-bottom: 13px; }
  .platform-group-heading h3 { font-size: 17px; }
  .platform-group-count { padding: 4px 7px; font-size: 8px; }
  .platform-logo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .platform-logo-card { grid-template-columns: 28px minmax(0, 1fr); min-height: 58px; padding: 8px; column-gap: 7px; border-radius: 9px; }
  .platform-logo-card img { width: 28px; height: 28px; }
  .platform-logo-card span { font-size: 10px; }
  .platform-logo-card small { font-size: 7px; }
  .platform-showcase-note { margin-top: 11px; font-size: 9px; text-align: left; }
}