/* ============================================================
   oneAgent 设计系统（命名空间 oa-，避免与 main.css 冲突）
   配色令牌 = Logo 青色系（浅色 #0b7f9b / 暗色 #22c7e8），2026-09-28 由紫色系切换
   浅/暗双主题，通过 <html data-theme="dark"> 切换（cookie 持久化）
   ============================================================ */
:root{
  /* ---- 品牌：Logo 青色系（2026-09-28 由紫色系切换）----
     浅色底用更深的青（#0b7f9b），保证正文对比度 ≥ 4.5:1；
     暗色底用亮青（见下方 [data-theme="dark"]）。 */
  --oa-brand:#0b7f9b; --oa-brand-2:#15a8c9; --oa-brand-soft:#e4f7fb;
  --oa-ai:#0b7f9b; --oa-ai-soft:#e9f8fc;
  /* 底色收敛到极淡的青灰，而不是纯灰 */
  --oa-ink:#08202a; --oa-muted:#5f7d89; --oa-line:#e2eef3; --oa-bg:#f4fbfd; --oa-card:#ffffff;
  --oa-free:#0d9488; --oa-free-soft:#e2f7f2;
  --oa-radius:16px; --oa-shadow:0 10px 34px -18px rgba(8,72,92,.28);
  /* ---- 工作台共用扩展令牌 ---- */
  --oa-ring:rgba(11,127,155,.34);
  --oa-glow:rgba(21,168,201,.30);
  --oa-hair:inset 0 1px 0 rgba(255,255,255,.85);
  --oa-glass:rgba(255,255,255,.72);
  --oa-noise-op:.03;
  --oa-ease:cubic-bezier(.22,.61,.36,1);
  --oa-spring:cubic-bezier(.34,1.46,.6,1);
}
[data-theme="dark"]{
  --oa-brand:#22c7e8; --oa-brand-2:#7fe3f5; --oa-brand-soft:#0c2c35;
  --oa-ink:#e8f6fa; --oa-muted:#8fabb6; --oa-line:#1b313b; --oa-bg:#071319; --oa-card:#0d1f27;
  --oa-free:#34d399; --oa-free-soft:#122f2a; --oa-ai:#22c7e8; --oa-ai-soft:#0c2c35;
  --oa-shadow:0 12px 40px -20px rgba(0,0,0,.75);
  --oa-ring:rgba(34,199,232,.40);
  --oa-glow:rgba(34,199,232,.32);
  --oa-hair:inset 0 1px 0 rgba(255,255,255,.06);
  --oa-glass:rgba(9,28,36,.70);
  --oa-noise-op:.05;
  /* 旧 oneCMS 令牌：深色主题映射到 oa- 深色，保持整套站点主题一致 */
  --primary:var(--oa-brand); --primary-dark:var(--oa-brand-2); --primary-light:var(--oa-brand-2);
  --accent:var(--oa-brand-2);
  --bg:var(--oa-bg); --bg-card:var(--oa-card); --bg-elevated:var(--oa-card); --bg-hover:var(--oa-bg); --bg-border:var(--oa-line);
  --text:var(--oa-ink); --text-secondary:var(--oa-ink); --text-muted:var(--oa-muted);
  --border:var(--oa-line); --border-hover:#2a4652;
  --gradient-primary:linear-gradient(135deg,var(--oa-brand),var(--oa-brand-2));
  --gradient-glow:radial-gradient(ellipse 80% 50% at 50% -20%, rgba(34,199,232,.18), transparent);
  --oa-cta-grad:linear-gradient(135deg,var(--oa-brand),var(--oa-brand-2));
}
/* 兼容旧 oneCMS 页面：将其设计令牌统一映射到 oa- 品牌（浅色默认），
   实现「风格统一」且不改动任何模板/JS。oneagent.css 在 main.css 之后加载，故覆盖生效。 */
:root{
  --primary:var(--oa-brand); --primary-dark:var(--oa-brand-2); --primary-light:var(--oa-brand-2);
  --accent:var(--oa-brand-2); --accent-dark:var(--oa-brand);
  --bg:var(--oa-bg); --bg-card:var(--oa-card); --bg-elevated:var(--oa-card); --bg-hover:var(--oa-bg); --bg-border:var(--oa-line);
  --text:var(--oa-ink); --text-secondary:var(--oa-ink); --text-muted:var(--oa-muted);
  --border:var(--oa-line); --border-hover:#cfd3e6;
  --gradient-primary:linear-gradient(135deg,var(--oa-brand),var(--oa-brand-2));
  --gradient-bg:linear-gradient(135deg,var(--oa-bg) 0%, #e6f5fa 100%);
  --gradient-glow:radial-gradient(ellipse 80% 50% at 50% -20%, rgba(11,127,155,.16), transparent);
  --radius:16px; --radius-lg:20px; --radius-sm:10px;
  --shadow:var(--oa-shadow); --shadow-lg:var(--oa-shadow); --shadow-glow:0 0 40px rgba(11,127,155,.20);
  --container-w:1180px;
  /* 旧 CMS 深色区块（CTA）统一为品牌渐变，保持视觉焦点 */
  --oa-cta-grad:linear-gradient(135deg,var(--oa-brand),var(--oa-brand-2));
}
/* 旧 CMS 的 .section-dark / .cta-section 在统一品牌下改为品牌渐变 */
.section.section-dark, .cta-section{
  background:var(--oa-cta-grad) !important; color:#fff;
}
.section.section-dark .section-title, .section.section-dark h2, .section.section-dark .section-sub,
.cta-section h2, .cta-section .section-title, .cta-section .cta-inner h2{ color:#fff; }
.section.section-dark p, .section.section-dark .section-sub, .cta-section p, .cta-section .cta-inner p{ color:rgba(255,255,255,.86); }
.section.section-dark .btn-outline, .cta-section .btn-outline{ color:#fff; border-color:rgba(255,255,255,.55); }
/* 注意：.page-hero-title 的主题适配已直接改在 main.css（纯色 var(--text)）。
   此前在此处加的「渐变文字」覆盖会因 `background: ... !important` 简写把
   background-clip 重置回 border-box，导致标题整块被涂上背景色（两个主题都错）
   → 已移除该覆盖，避免与 main.css 冲突，改为 single source of truth。 */
/* main.css:1476 的 .tag-chip:hover 在浅色主题下为白字 + 淡紫底（rgba(11,127,155,.2)）不可读，
   文章详情页等会用到 → 改为跟随主题令牌（浅色深字 / 深色亮字，两主题均可读）。 */
.tag-chip:hover{ color:var(--oa-ink) !important; }
* { box-sizing: border-box; }
.oa-wrap{ max-width:1180px; margin:0 auto; padding:0 24px; }
/* ---------- Header / Nav（原型 topbar 规格：品牌方块 + 居中胶囊导航 + 发光积分 chip） ---------- */
.oa-header{
  position:sticky; top:0; z-index:40;
  background:color-mix(in srgb, var(--oa-bg) 72%, transparent);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  backdrop-filter:blur(16px) saturate(150%);
  border-bottom:1px solid var(--oa-line);
}
@supports not (background:color-mix(in srgb, red 50%, blue)){
  .oa-header{ background:var(--oa-card); }
}
.oa-nav{ display:flex; align-items:center; gap:18px; min-height:62px; }
.oa-logo{ display:inline-flex; align-items:center; gap:10px; flex:none; font-size:15px; font-weight:700; letter-spacing:.02em; color:var(--oa-ink); }
.oa-logo-mark{
  position:relative; width:36px; height:36px; flex:none; border-radius:11px;
  display:grid; place-items:center;
  background:linear-gradient(150deg, color-mix(in srgb, var(--oa-brand-2) 20%, transparent),
                                     color-mix(in srgb, var(--oa-brand) 6%, transparent));
  border:1px solid color-mix(in srgb, var(--oa-brand) 32%, transparent);
  box-shadow:var(--oa-hair), 0 6px 18px -10px var(--oa-brand);
  transition:transform .4s var(--oa-spring), box-shadow .4s var(--oa-ease);
}
.oa-logo:hover .oa-logo-mark{ transform:translateY(-1px) rotate(-4deg); box-shadow:var(--oa-hair), 0 10px 26px -10px var(--oa-brand); }
.oa-logo-img{ width:27px; height:27px; border-radius:0; object-fit:contain; display:block; }
.oa-logo .oa-dot{ width:26px; height:26px; border-radius:8px; background:linear-gradient(135deg,var(--oa-brand),var(--oa-brand-2)); box-shadow:0 6px 16px rgba(11,127,155,.35); }
.oa-logo .oa-sub{ color:var(--oa-muted); font-weight:500; font-size:14px; }

/* 居中胶囊导航 + 滑动指示条 */
.oa-nav-links{
  position:relative; display:flex; align-items:center; gap:2px;
  margin:0 auto; padding:4px; border-radius:999px;
  background:var(--oa-card); border:1px solid var(--oa-line);
}
.oa-nav-ink{
  position:absolute; top:4px; bottom:4px; left:4px; width:0;
  border-radius:999px; pointer-events:none;
  background:linear-gradient(135deg, var(--oa-brand-soft), transparent);
  border:1px solid color-mix(in srgb, var(--oa-brand) 30%, transparent);
  box-shadow:0 0 22px -6px var(--oa-brand);
  transition:left .42s var(--oa-spring), width .42s var(--oa-spring), opacity .24s var(--oa-ease);
  opacity:0;
}
.oa-nav-ink.oa-ready{ opacity:1; }
.oa-nav-links a{
  position:relative; z-index:1; padding:7px 15px; border-radius:999px;
  font-size:13.5px; font-weight:500; color:var(--oa-muted); white-space:nowrap;
  transition:color .25s var(--oa-ease);
}
.oa-nav-links a:hover{ color:var(--oa-ink); background:transparent; }
.oa-nav-links a.active{ color:var(--oa-brand); font-weight:600; background:transparent; }

.oa-nav-right{ display:flex; align-items:center; gap:10px; flex:none; }

/* 积分 chip（原型 credit-chip：发光小点 + 数字 + 单位） */
.oa-balance{
  display:inline-flex; align-items:center; gap:7px; height:34px; padding:0 13px;
  border-radius:999px; font-size:13px; font-weight:500; color:var(--oa-muted);
  background:var(--oa-card); border:1px solid var(--oa-line); text-decoration:none;
  transition:border-color .28s var(--oa-ease), transform .28s var(--oa-ease), box-shadow .28s var(--oa-ease);
}
.oa-balance:hover{ border-color:color-mix(in srgb, var(--oa-brand) 40%, transparent); transform:translateY(-1px); box-shadow:var(--oa-shadow); }
.oa-balance .oa-coin{
  width:11px; height:11px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #fff, var(--oa-brand) 62%, var(--oa-brand-2));
  box-shadow:0 0 10px var(--oa-brand);
  animation:oaGlow 2.6s ease-in-out infinite;
}
.oa-balance-num{ font-weight:700; color:var(--oa-ink); font-size:13.5px; font-variant-numeric:tabular-nums; }
.oa-balance-unit{ color:var(--oa-muted); font-size:12px; }

/* 按钮（原型 .btn：高光扫过 + 按压回弹） */
.oa-btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:7px;
  height:38px; padding:0 18px; border:none; border-radius:10px; cursor:pointer;
  font-size:13.5px; font-weight:600; white-space:nowrap; text-decoration:none;
  overflow:hidden; isolation:isolate;
  transition:transform .22s var(--oa-ease), box-shadow .3s var(--oa-ease),
             background .3s var(--oa-ease), border-color .3s var(--oa-ease), color .3s var(--oa-ease);
}
.oa-btn:active{ transform:scale(.97); }
.oa-btn-sm{ height:33px; padding:0 14px; font-size:13px; border-radius:8px; }
.oa-btn-primary{
  background:linear-gradient(135deg, var(--oa-brand), var(--oa-brand-2));
  color:#fff; box-shadow:0 10px 26px -14px var(--oa-brand), var(--oa-hair);
}
.oa-btn-primary:hover{ transform:translateY(-1px); box-shadow:0 14px 34px -12px var(--oa-brand), var(--oa-hair); }
.oa-btn-ghost{ background:var(--oa-card); border:1px solid var(--oa-line); color:var(--oa-muted); }
.oa-btn-ghost:hover{ border-color:color-mix(in srgb, var(--oa-brand) 40%, transparent); color:var(--oa-ink); }
.oa-btn-stop{ background:linear-gradient(135deg,#ef4444,#dc2626); color:#fff; box-shadow:0 10px 26px -14px #dc2626; }
.oa-btn-primary .oa-sheen{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(105deg, transparent 30%, rgba(255,255,255,.42) 50%, transparent 70%);
  transform:translateX(-130%) skewX(-18deg);
}
.oa-btn-primary:hover .oa-sheen{ animation:oaSheen .9s var(--oa-ease); }

/* 主题切换（原型 icon-btn：34px + 日/月图标） */
.oa-theme-toggle{
  width:34px; height:34px; border-radius:10px; flex:none;
  display:grid; place-items:center; cursor:pointer; color:var(--oa-muted);
  background:transparent; border:1px solid transparent;
  transition:color .25s, background .25s, border-color .25s, transform .25s var(--oa-ease);
}
.oa-theme-toggle:hover{ color:var(--oa-brand); background:var(--oa-brand-soft); border-color:var(--oa-line); }
.oa-theme-toggle:active{ transform:scale(.94); }
.oa-theme-toggle .oa-i{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round; transition:transform .3s var(--oa-spring); }
.oa-theme-toggle .oa-i-moon{ display:none; }
[data-theme="light"] .oa-theme-toggle .oa-i-sun{ display:none; }
[data-theme="light"] .oa-theme-toggle .oa-i-moon{ display:block; }
.oa-theme-toggle:hover .oa-i{ transform:rotate(24deg); }

/* 会员头像按钮（原型页顶栏右侧的 avatar-btn） */
.oa-avatar-btn{ padding:0; border-radius:50%; line-height:0; flex:none; }
.oa-avatar{
  position:relative; display:grid; place-items:center; flex:none;
  width:32px; height:32px; border-radius:50%;
  font-size:13px; font-weight:700; color:#fff;
  background:linear-gradient(140deg, var(--oa-brand-2), var(--oa-brand) 55%);
  box-shadow:0 0 0 1px color-mix(in srgb, var(--oa-brand) 30%, transparent), 0 6px 16px -8px var(--oa-brand);
  transition:transform .3s var(--oa-spring);
}
.oa-avatar-btn:hover .oa-avatar{ transform:scale(1.06); }
.oa-avatar--sm{ width:32px; height:32px; font-size:12.5px; }
/* 有头像时：img 铺满圆形容器（与 .pf-avatar / 工作台身份卡同一套显示逻辑） */
.oa-avatar-img{ width:100%; height:100%; border-radius:inherit; object-fit:cover; display:block; }

.oa-menu-toggle{
  display:none; width:34px; height:34px; border-radius:10px;
  border:1px solid var(--oa-line); background:var(--oa-card); color:var(--oa-ink);
  font-size:16px; align-items:center; justify-content:center; cursor:pointer;
}

/* 关键帧（原先挂在已整体替换的 oa-redesign.css 上，这里补回，避免头部动效失效） */
@keyframes oaSheen{ 0%{transform:translateX(-130%) skewX(-18deg)} 100%{transform:translateX(330%) skewX(-18deg)} }
@keyframes oaGlow{ 0%,100%{transform:scale(1);opacity:1} 50%{transform:scale(1.16);opacity:.78} }
@keyframes oaPulse{ 0%,100%{opacity:1} 50%{opacity:.34} }

.oa-ai-text{ word-break:break-word; line-height:1.68; white-space:normal; }
/* ---------- AI 正文 Markdown 渲染（标题/加粗/列表/表格/引用） ---------- */
.oa-ai-text > :first-child{ margin-top:0; }
.oa-ai-text > :last-child{ margin-bottom:0; }
.oa-ai-text p{ margin:0 0 10px; }
.oa-ai-text h1,.oa-ai-text h2,.oa-ai-text h3,.oa-ai-text h4,.oa-ai-text h5{ margin:16px 0 8px; line-height:1.35; font-weight:700; color:var(--oa-ink); }
.oa-ai-text h1{ font-size:21px; }
.oa-ai-text h2{ font-size:18px; }
.oa-ai-text h3{ font-size:16px; }
.oa-ai-text h4,.oa-ai-text h5{ font-size:15px; }
.oa-ai-text ul,.oa-ai-text ol{ margin:8px 0 10px; padding-left:22px; }
.oa-ai-text li{ margin:3px 0; }
.oa-ai-text li > ul,.oa-ai-text li > ol{ margin:3px 0; }
.oa-ai-text strong{ font-weight:700; color:var(--oa-ink); }
.oa-ai-text em{ font-style:italic; }
.oa-ai-text del{ text-decoration:line-through; opacity:.7; }
.oa-ai-text a{ color:var(--oa-brand); text-decoration:underline; word-break:break-all; }
.oa-ai-text code{ background:var(--oa-bg); border:1px solid var(--oa-line); border-radius:5px; padding:1px 5px; font-size:.9em; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.oa-ai-text pre{ background:var(--oa-bg); border:1px solid var(--oa-line); border-radius:9px; padding:10px 12px; overflow:auto; margin:10px 0; }
.oa-ai-text pre code{ background:none; border:none; padding:0; font-size:12.5px; line-height:1.55; }
.oa-ai-text blockquote{ margin:10px 0; padding:6px 12px; border-left:3px solid var(--oa-line); color:var(--oa-muted); background:var(--oa-bg); border-radius:0 6px 6px 0; }
.oa-ai-text hr{ border:none; border-top:1px solid var(--oa-line); margin:14px 0; }
.oa-ai-text table{ border-collapse:collapse; width:100%; margin:10px 0; font-size:13px; display:block; overflow-x:auto; }
.oa-ai-text th,.oa-ai-text td{ border:1px solid var(--oa-line); padding:6px 10px; text-align:left; vertical-align:top; }
.oa-ai-text thead th{ background:var(--oa-bg); font-weight:600; color:var(--oa-ink); }
.oa-ai-text tbody tr:nth-child(even){ background:rgba(125,125,145,.06); }
/* ---------- Hero ---------- */
.oa-hero{ padding:64px 0 40px; text-align:center; }
.oa-eyebrow{ display:inline-block; font-size:13px; color:var(--oa-brand); background:var(--oa-brand-soft); padding:6px 14px; border-radius:999px; font-weight:600; margin-bottom:18px; }
.oa-h1{ font-size:44px; line-height:1.18; margin:0 0 16px; letter-spacing:-.5px; color:var(--oa-ink); }
.oa-h1 .oa-grad{ background:linear-gradient(135deg,var(--oa-brand),var(--oa-brand-2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.oa-sub{ font-size:17px; color:var(--oa-muted); max-width:640px; margin:0 auto 28px; line-height:1.7; }
.oa-searchbar{ display:flex; align-items:center; gap:10px; max-width:620px; margin:0 auto; background:var(--oa-card); border:1px solid var(--oa-line); border-radius:14px; padding:10px 10px 10px 18px; box-shadow:var(--oa-shadow); }
.oa-searchbar input{ flex:1; border:none; outline:none; font-size:15px; background:transparent; color:var(--oa-ink); }
.oa-hint{ margin-top:14px; font-size:13px; color:var(--oa-muted); }
.oa-hint b{ color:var(--oa-free); }
/* ---------- Sections / Cards ---------- */
.oa-section{ padding:34px 0; }
.oa-sec-head{ display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:22px; gap:16px; flex-wrap:wrap; }
.oa-sec-head h2{ font-size:24px; margin:0; color:var(--oa-ink); }
.oa-sec-head p{ color:var(--oa-muted); font-size:14px; margin:6px 0 0; }
.oa-tag{ font-size:13px; font-weight:600; padding:5px 12px; border-radius:999px; }
.oa-tag.free{ color:var(--oa-free); background:var(--oa-free-soft); }
.oa-tag.ai{ color:var(--oa-ai); background:var(--oa-ai-soft); }
.oa-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(248px,1fr)); gap:16px; }
.oa-card{ background:var(--oa-card); border:1px solid var(--oa-line); border-radius:var(--oa-radius); padding:20px; transition:.18s; position:relative; overflow:hidden; }
.oa-card:hover{ transform:translateY(-3px); box-shadow:var(--oa-shadow); border-color:#dfe2f1; }
.oa-card .oa-ic{ width:42px; height:42px; border-radius:11px; display:flex; align-items:center; justify-content:center; margin-bottom:14px; font-size:20px; }
.oa-ic.free{ background:var(--oa-free-soft); }
.oa-ic.ai{ background:var(--oa-ai-soft); }
.oa-card h3{ margin:0 0 6px; font-size:16px; display:flex; align-items:center; gap:8px; color:var(--oa-ink); }
.oa-card p{ margin:0; color:var(--oa-muted); font-size:13px; line-height:1.6; }
.oa-card .oa-ex{ margin-top:12px; font-size:12px; color:#9aa1b5; background:var(--oa-bg); border-radius:8px; padding:8px 10px; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.oa-pill{ font-size:11px; font-weight:700; padding:2px 8px; border-radius:6px; }
.oa-pill.free{ color:var(--oa-free); background:var(--oa-free-soft); }
.oa-pill.ai{ color:var(--oa-ai); background:var(--oa-ai-soft); }
.oa-group-gap{ margin-top:14px; }
/* ---------- Workspace preview ---------- */
.oa-ws{ display:grid; grid-template-columns:1fr 1fr; gap:18px; background:var(--oa-card); border:1px solid var(--oa-line); border-radius:20px; padding:18px; box-shadow:var(--oa-shadow); }
.oa-panel{ border:1px solid var(--oa-line); border-radius:14px; min-height:300px; overflow:hidden; display:flex; flex-direction:column; }
.oa-ph{ display:flex; align-items:center; gap:8px; padding:12px 14px; border-bottom:1px solid var(--oa-line); font-size:13px; font-weight:600; color:var(--oa-muted); }
.oa-ph .oa-d{ width:9px; height:9px; border-radius:50%; }
.oa-bubble{ margin:12px 14px; padding:12px 14px; border-radius:12px; font-size:13px; line-height:1.6; max-width:90%; }
.oa-bubble.oa-user{ background:var(--oa-brand-soft); align-self:flex-end; max-width:80%; }
.oa-bubble.oa-ai{ background:var(--oa-bg); border:1px solid var(--oa-line); }
.oa-tool-row{ display:flex; align-items:center; gap:8px; margin:0 14px 10px; font-size:12px; color:var(--oa-muted); background:var(--oa-bg); border:1px solid var(--oa-line); border-radius:9px; padding:8px 10px; }
.oa-tool-row .oa-tk{ width:7px; height:7px; border-radius:50%; background:var(--oa-free); }
.oa-docmock{ padding:18px 20px; font-size:13px; line-height:1.8; color:#374151; }
.oa-docmock h4{ margin:0 0 8px; font-size:16px; color:var(--oa-ink); }
.oa-docmock .oa-slide{ margin-top:14px; border:1px dashed #cfd3e6; border-radius:10px; padding:12px; }
/* ---------- Pricing ---------- */
.oa-plans{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.oa-plan{ background:var(--oa-card); border:1px solid var(--oa-line); border-radius:var(--oa-radius); padding:22px; text-align:center; }
.oa-plan.oa-hot{ border-color:var(--oa-brand); box-shadow:0 12px 30px rgba(11,127,155,.16); }
.oa-plan .oa-name{ font-weight:700; font-size:16px; color:var(--oa-ink); }
.oa-plan .oa-price{ font-size:30px; font-weight:800; margin:10px 0 2px; color:var(--oa-ink); }
.oa-plan .oa-price small{ font-size:14px; color:var(--oa-muted); font-weight:500; }
.oa-plan .oa-feat{ color:var(--oa-muted); font-size:13px; line-height:1.9; margin:14px 0; }
.oa-plan .oa-btn{ width:100%; justify-content:center; margin-top:6px; }
/* ---------- Footer ---------- */
.oa-footer{ border-top:1px solid var(--oa-line); padding:34px 0 26px; color:var(--oa-muted); font-size:13px; margin-top:30px; }
.oa-footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:24px; }
.oa-footer .oa-logo{ margin-bottom:12px; }
.oa-footer h4{ color:var(--oa-ink); font-size:14px; margin:0 0 12px; }
.oa-footer ul{ list-style:none; padding:0; margin:0; }
.oa-footer li{ margin-bottom:8px; }
.oa-footer a{ color:var(--oa-muted); text-decoration:none; }
.oa-footer a:hover{ color:var(--oa-ink); }
.oa-footer-bottom{ margin-top:24px; padding-top:18px; border-top:1px solid var(--oa-line); display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; }
/* ---------- Generic page header ---------- */
.oa-page{ padding:48px 0; }
.oa-page h1{ font-size:34px; color:var(--oa-ink); margin:0 0 12px; }
.oa-page .oa-lead{ color:var(--oa-muted); font-size:16px; max-width:680px; line-height:1.7; }
.oa-prose{ color:var(--oa-muted); font-size:15px; line-height:1.9; max-width:760px; }
.oa-prose h3{ color:var(--oa-ink); margin:26px 0 10px; }
.oa-login-tip{ padding:40px; text-align:center; color:var(--oa-muted); }
/* ---------- About page: stats ---------- */
.oa-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.oa-stat{ background:var(--oa-card); border:1px solid var(--oa-line); border-radius:var(--oa-radius); padding:22px 18px; text-align:center; }
.oa-stat-num{ display:block; font-size:34px; font-weight:800; color:var(--oa-ink); line-height:1.1; }
.oa-stat-plus{ color:var(--oa-brand); font-weight:800; }
.oa-stat-label{ display:block; margin-top:6px; font-size:13px; color:var(--oa-muted); }
/* ---------- About page: CTA band ---------- */
.oa-cta{ background:linear-gradient(135deg,var(--oa-brand),var(--oa-brand-2)); border-radius:24px; padding:48px 24px; text-align:center; }
.oa-cta-inner h2{ color:#fff; font-size:28px; margin:0 0 10px; }
.oa-cta-inner p{ color:rgba(255,255,255,.85); margin:0 0 22px; font-size:15px; }
.oa-cta-btns{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.oa-cta .oa-btn-ghost{ background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.4); color:#fff; }
.oa-cta .oa-btn-ghost:hover{ background:rgba(255,255,255,.22); border-color:rgba(255,255,255,.6); }
/* ---------- 2-column grid modifier (advantages) ---------- */
.oa-grid-2{ grid-template-columns:repeat(2,1fr); }
/* ---------- Contact page ---------- */
.oa-contact-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:20px; align-items:start; }
.oa-contact-left{ display:flex; flex-direction:column; gap:16px; }
.oa-contact-left .oa-grid{ grid-template-columns:repeat(2,1fr); }
.oa-ic-info{ background:var(--oa-brand-soft); color:var(--oa-brand); }
.oa-info-card .oa-ic{ font-size:18px; }
.oa-info-card .oa-ti-title{ font-size:13px; color:var(--oa-muted); margin-bottom:2px; }
.oa-info-card .oa-ti-desc{ font-size:15px; font-weight:600; color:var(--oa-ink); }
.oa-info-card .oa-note{ font-size:12px; color:var(--oa-muted); margin-top:4px; }
/* service promise */
.oa-promise h3, .oa-faq h3{ font-size:16px; color:var(--oa-ink); margin:0 0 12px; }
.oa-promise ul{ list-style:none; padding:0; margin:0; }
.oa-promise li{ display:flex; align-items:flex-start; gap:8px; font-size:13.5px; color:var(--oa-muted); line-height:1.6; margin-bottom:10px; }
.oa-promise li svg{ flex:none; color:var(--oa-free); margin-top:3px; }
.oa-promise li strong{ color:var(--oa-ink); }
/* faq */
.oa-faq-list{ display:flex; flex-direction:column; gap:8px; }
.oa-faq-item{ border:1px solid var(--oa-line); border-radius:11px; overflow:hidden; }
.oa-faq-q{ width:100%; text-align:left; background:transparent; border:none; cursor:pointer; padding:13px 14px; font-size:14px; font-weight:600; color:var(--oa-ink); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.oa-faq-q svg{ flex:none; transition:.2s; color:var(--oa-muted); }
.oa-faq-item.open .oa-faq-q svg{ transform:rotate(180deg); }
.oa-faq-a{ max-height:0; overflow:hidden; transition:max-height .25s ease; }
.oa-faq-item.open .oa-faq-a{ max-height:240px; }
.oa-faq-a p{ margin:0; padding:0 14px 14px; font-size:13px; color:var(--oa-muted); line-height:1.7; }
/* form */
.oa-form-card{ padding:22px; }
.oa-form-head{ margin-bottom:16px; }
.oa-form-head h2{ font-size:18px; color:var(--oa-ink); margin:0 0 4px; }
.oa-form-head p{ font-size:13px; color:var(--oa-muted); margin:0; }
.oa-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.oa-field{ margin-bottom:14px; }
.oa-field label{ display:block; font-size:13px; font-weight:600; color:var(--oa-ink); margin-bottom:6px; }
.oa-field .oa-req{ color:#e5484d; }
.oa-input, .oa-select, .oa-textarea{ width:100%; border:1px solid var(--oa-line); border-radius:11px; padding:10px 12px; font-size:14px; font-family:inherit; background:var(--oa-bg); color:var(--oa-ink); outline:none; transition:.15s; }
.oa-input:focus, .oa-select:focus, .oa-textarea:focus{ border-color:var(--oa-brand); background:var(--oa-card); }
.oa-textarea{ resize:vertical; min-height:110px; line-height:1.6; }
.oa-select{ appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--oa-muted) 50%),linear-gradient(135deg,var(--oa-muted) 50%,transparent 50%); background-position:calc(100% - 18px) 18px,calc(100% - 13px) 18px; background-size:5px 5px,5px 5px; background-repeat:no-repeat; }
.oa-submit{ width:100%; justify-content:center; margin-top:4px; }
.oa-form-feedback{ margin-top:12px; font-size:13px; text-align:center; min-height:18px; }
.oa-form-feedback.ok{ color:var(--oa-free); }
.oa-form-feedback.err{ color:#e5484d; }
/* ---------- Responsive ---------- */
@media (max-width: 980px){
  .oa-ws, .oa-plans{ grid-template-columns:1fr; }
  .oa-footer-grid{ grid-template-columns:1fr 1fr; }
  .oa-nav{ position:relative; }
  .oa-nav-links{ display:none; }
  .oa-nav-links.open{ display:flex; flex-direction:column; position:absolute; top:100%; left:0; right:0;
    background:var(--oa-card); border-bottom:1px solid var(--oa-line); padding:8px 20px 14px;
    gap:0; box-shadow:var(--oa-shadow); z-index:29; }
  .oa-nav-links.open a{ padding:12px 2px; border-bottom:1px solid var(--oa-line); font-size:15px; color:var(--oa-ink); }
  .oa-nav-links.open a:last-child{ border-bottom:none; }
  .oa-nav-ink{ display:none; }
  .oa-h1{ font-size:34px; }
  .oa-menu-toggle{ display:inline-flex; }
  .oa-stats{ grid-template-columns:repeat(2,1fr); }
  .oa-grid-2{ grid-template-columns:1fr; }
  .oa-contact-grid{ grid-template-columns:1fr; }
  .oa-form-row{ grid-template-columns:1fr; }
}