/* =========================================================================
   云服务主题 — 基础骨架
   - 只定义设计令牌、排版、容器、按钮、页脚、通栏 CTA 与全局提示
   - 顶栏皮肤在 neko.css，首页版式在 home.css
   - 配色：深蓝墨 #0c1526 / 品牌蓝 #2563eb / 石板灰 #3f5170 / 浅雾 #f4f7fc
   - 直角优先（8–10px），只用发丝分隔线，不用彩色渐变与圆润胶囊
   ========================================================================= */

/* ------------------------------ 01 设计令牌 ------------------------------ */
:root{
  --nc-bg:#f4f7fc;
  --nc-paper:#ffffff;
  --nc-cream:#eef3fa;
  --nc-ink:#0c1526;
  --nc-ink2:#3f5170;
  --nc-ink3:#63748f;
  --nc-muted:#93a1b8;
  --nc-brand:#2563eb;
  --nc-brand2:#1d4ed8;
  --nc-brand-soft:#eaf1ff;
  --nc-brand-grad:linear-gradient(135deg,#3b82f6 0%,#2563eb 58%,#1e40af 100%);
  --nc-line:#e2e8f3;
  --nc-line2:#eef2f9;
  --nc-green:#16a34a;
  --nc-amber:#d97706;
  --nc-pink:#94a3b8;
  --nc-pink-soft:#eef2f9;
  --nc-matcha:#0f766e;
  --nc-radius:10px;
  --nc-radius-sm:8px;
  --nc-shadow:0 20px 44px -30px rgba(12,21,38,.40);
  --nc-shadow-sm:0 1px 2px rgba(12,21,38,.05),0 10px 26px -22px rgba(12,21,38,.30);
  --nc-nav-h:66px;
  --nc-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;

  /* 兼容共享 nav.php / bottom-nav.php 里用到的变量名 */
  --brand:#2563eb;
  --brand2:#1d4ed8;
  --ink:#0c1526;
  --ink2:#3f5170;
  --ink3:#63748f;
  --line:#e2e8f3;
  --radius:10px;
  --radius-sm:8px;
}

/* ------------------------------ 02 基础排版 ------------------------------ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--nc-bg)}
body{
  margin:0;
  min-height:100%;
  color:var(--nc-ink2);
  background:var(--nc-bg);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:15px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{margin:0;color:var(--nc-ink);font-weight:700;line-height:1.22;letter-spacing:-.4px}
h1{font-size:clamp(30px,3.6vw,52px);line-height:1.12}
h2{font-size:clamp(23px,2.2vw,36px)}
h3{font-size:17px}
p{margin:0}
img{max-width:100%;height:auto;border:0}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
ul,ol{margin:0;padding:0;list-style:none}
::selection{background:rgba(37,99,235,.16);color:var(--nc-ink)}
:focus-visible{outline:2px solid var(--nc-brand);outline-offset:2px}
.nc-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ------------------------------ 03 布局 ------------------------------ */
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}
.nc-main{display:block;min-height:52vh}
.nc-sec{padding:76px 0}
.nc-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:30px;flex-wrap:wrap}
.nc-sec-head-center{justify-content:center;text-align:center}
.nc-kicker{display:inline-flex;align-items:center;gap:9px;margin-bottom:12px;
  color:var(--nc-brand);font-family:var(--nc-mono);font-size:11.5px;font-weight:600;
  letter-spacing:1.6px;text-transform:uppercase}
.nc-kicker svg{width:15px;height:15px;flex:none}
.nc-sec-head p{color:var(--nc-ink3);font-size:14.5px;max-width:640px}
.nc-muted{color:var(--nc-muted)}

/* ------------------------------ 04 按钮 ------------------------------ */
.nc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:46px;padding:0 22px;border:1px solid transparent;border-radius:var(--nc-radius-sm);
  font-size:14.5px;font-weight:600;line-height:1.2;white-space:nowrap;
  transition:background .18s,border-color .18s,color .18s,box-shadow .18s}
.nc-btn svg{width:17px;height:17px;flex:none}
.nc-btn-main{background:var(--nc-brand);color:#fff}
.nc-btn-main:hover{background:var(--nc-brand2);box-shadow:0 12px 24px -16px rgba(37,99,235,.9)}
.nc-btn-ghost{background:var(--nc-paper);color:var(--nc-ink2);border-color:var(--nc-line)}
.nc-btn-ghost:hover{border-color:#b9c9e6;color:var(--nc-brand);background:var(--nc-paper)}
.nc-btn:active{transform:translateY(1px)}

/* ------------------------------ 05 页脚 ------------------------------ */
.footer{margin-top:0;padding:56px 0 26px;color:var(--nc-ink2);
  background:var(--nc-paper);border-top:1px solid var(--nc-line)}
.footer-grid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:36px;align-items:start}
.footer-grid h4{margin:0 0 14px;color:var(--nc-ink);font-size:13px;font-weight:700;letter-spacing:.4px}
.footer-grid a{display:block;margin-bottom:9px;color:var(--nc-ink3);font-size:13.5px;transition:color .16s}
.footer-grid a:hover{color:var(--nc-brand)}
.footer .about p{margin:0 0 14px;max-width:360px;color:var(--nc-ink3);font-size:13.5px;line-height:1.85}
.footer .ft-logo{display:block;max-height:40px;width:auto;margin-bottom:14px}
.footer .about h4{font-size:18px;margin-bottom:12px;letter-spacing:-.3px}
.footer .ft-site{display:inline-flex;align-items:center;gap:7px;color:var(--nc-brand);font-size:13px;font-weight:600}
.footer .ft-site svg{width:15px;height:15px;flex:none}
.footer .ft-site:hover{text-decoration:underline}
.copyright{margin-top:36px;padding-top:20px;border-top:1px solid var(--nc-line);text-align:center}
.copyright p{margin:0;color:var(--nc-muted);font-size:12.5px;line-height:2}
.copyright a{color:var(--nc-ink3)}
.copyright a:hover{color:var(--nc-brand)}

/* ------------------------------ 06 通栏 CTA ------------------------------ */
.nc-cta{position:relative;overflow:hidden}
.nc-cta-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;
  padding:32px 36px;border:1px solid var(--nc-line);border-radius:var(--nc-radius);
  background:var(--nc-paper);box-shadow:var(--nc-shadow-sm)}
.nc-cta-kicker{display:inline-flex;align-items:center;gap:8px;margin-bottom:10px;
  color:var(--nc-brand);font-family:var(--nc-mono);font-size:11.5px;font-weight:600;letter-spacing:1.4px}
.nc-cta-kicker svg{width:15px;height:15px;flex:none}
.nc-cta h3{font-size:clamp(20px,2vw,26px);margin-bottom:8px}
.nc-cta p{color:var(--nc-ink3);font-size:13.5px}
.nc-cta-actions{display:flex;gap:12px;flex-wrap:wrap}

/* ------------------------------ 07 全局提示 ------------------------------ */
.toast{position:fixed;left:50%;bottom:28px;z-index:200;transform:translate(-50%,14px);
  max-width:min(92vw,460px);padding:12px 20px;border-radius:var(--nc-radius-sm);
  background:rgba(12,21,38,.95);color:#fff;font-size:13.5px;font-weight:500;text-align:center;
  box-shadow:0 18px 36px -18px rgba(12,21,38,.8);opacity:0;pointer-events:none;
  transition:opacity .25s,transform .25s}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast.ok{background:rgba(22,101,52,.96)}
.toast.err{background:rgba(153,27,27,.96)}

/* ------------------------------ 08 响应式 ------------------------------ */
@media(max-width:900px){
  .footer-grid{grid-template-columns:1.4fr repeat(3,1fr);gap:24px}
  .nc-sec{padding:56px 0}
}
@media(max-width:680px){
  .container{padding:0 16px}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
  .footer .about{grid-column:1 / -1}
  .footer .about p{max-width:none}
  .nc-sec{padding:46px 0}
  .nc-sec-head{margin-bottom:22px}
  .nc-sec-head p{font-size:13.5px}
  .nc-cta-inner{padding:22px 18px}
  .nc-btn{min-height:44px;padding:0 18px}
}
@media(max-width:420px){
  .footer-grid{grid-template-columns:1fr;gap:18px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .nc-btn,.footer-grid a,.toast{transition:none}
}
