/* ============================================================
   Autolab Sign-Off 換膚層｜salesgift.autolab.cloud（業務 AI 超能力名單磁鐵）
   2026-10-11。規範：logo-signoff/02-品牌核心.md；同 tool-site-theme 的色票。
   紫色漸層 → 主色青／墨；拿掉 </head> 前那行 link 就回到舊樣子。
   橘 #FF6B35 只給一處：「預約企業諮詢」鈕（實心、墨字、無光暈）。
   ============================================================ */
@import url("https://fonts.googleapis.com/css2?family=Inter+Tight:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap");

:root {
  --so-teal: #00708A; --so-teal-dk: #005A6F; --so-teal-lt: #E8F4F6;
  --so-ink: #1C1C1E; --so-sub: #636366; --so-mist: #F5F5F7; --so-line: #E5E5EA;
  --so-mango: #FFC233; --so-mango-lt: #FFF1D6; --so-orchid: #9C2A6B; --so-orchid-lt: #F6E6F0;
  --so-orange: #FF6B35;

  /* 接管站內變數 */
  --grad-start: var(--so-teal);
  --grad-end: var(--so-teal);
  --accent: var(--so-teal);
  --text-primary: var(--so-ink);
  --text-secondary: var(--so-sub);
  --text-muted: #8E8E93;
  --border-light: var(--so-line);
  --bg-subtle: var(--so-mist);
  --radius: 4px;
}
html body { font-family: 'Inter', 'Noto Sans TC', sans-serif; color: var(--so-ink); background: #FFFFFF; }
html body h1, html body h2, html body h3 { font-family: 'Inter Tight', 'Noto Sans TC', sans-serif; }

/* 漸層字一律改實色 */
html body .hero h1, html body .form-success h3, html body .instructor-quote, html body .proof-bottom span {
  background: none; -webkit-background-clip: border-box; background-clip: border-box;
  -webkit-text-fill-color: currentColor;
}
html body .hero h1 { color: var(--so-ink); letter-spacing: -.02em; }
html body .proof-bottom span { color: var(--so-orchid); }
html body .instructor-quote { color: var(--so-ink); font-style: normal; }
html body .form-success h3 { color: var(--so-teal); }

/* ---------- Hero：白底＋簽名線＋章壓線 ---------- */
html body .hero { background: #FFFFFF; }
html body .hero::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 96px;
  height: 3px; background: var(--so-ink); pointer-events: none;
}
html body .hero::after {
  content: ""; position: absolute; right: max(24px, calc((100% - 960px) / 2));
  bottom: 97.5px; width: 72px; height: 72px; transform: translateY(50%);
  background: #FFFFFF url("/assets/autolab-icon-64.svg") center / contain no-repeat;
  border-radius: 50%; pointer-events: none;
}
html body .hero-badge {
  color: var(--so-ink); background: var(--so-mango); border: 0; border-radius: 2px;
  font-family: 'JetBrains Mono', 'Noto Sans TC', monospace; font-weight: 700;
}
html body .stat strong { color: var(--so-teal); }
html body .scroll-hint span { font-family: 'JetBrains Mono', 'Noto Sans TC', monospace; }

/* ---------- 按鈕 ---------- */
html body .btn-primary {
  background: var(--so-teal); color: #FFFFFF; border-radius: 4px; box-shadow: none;
}
html body .btn-primary:hover { background: var(--so-teal-dk); transform: none; box-shadow: none; }
html body .form-card .btn-primary { border-radius: 4px; }
html body .btn-pill { background: var(--so-ink); color: #FFFFFF; border-radius: 4px; }
html body .btn-pill:hover { background: var(--so-teal); transform: none; box-shadow: none; }
/* 唯一的橘 */
html body .btn-outline {
  background: var(--so-orange); color: var(--so-ink); border: 0; border-radius: 4px;
}
html body .btn-outline:hover { background: var(--so-orange); color: var(--so-ink); filter: brightness(1.04); transform: none; }

/* ---------- 痛點 ---------- */
html body .pain-item { border-radius: 4px; box-shadow: none; border-left: 4px solid var(--so-teal); }
html body .pain-item:nth-child(3n+2) { border-left-color: var(--so-mango); }
html body .pain-item:nth-child(3n) { border-left-color: var(--so-orchid); }
html body .pain-item strong { color: var(--so-ink); box-shadow: inset 0 -6px 0 var(--so-mango-lt); }
html body .pain-bottom { color: var(--so-teal); }

/* ---------- 四個超能力卡 ---------- */
html body .card { border-radius: 4px; box-shadow: none; }
html body .card::before { opacity: 1; height: 4px; background: var(--so-teal); }
html body .card:nth-child(2)::before { background: var(--so-mango); }
html body .card:nth-child(3)::before { background: var(--so-orchid); }
html body .card:nth-child(4)::before { background: var(--so-ink); }
html body .card:hover { transform: none; border-color: var(--so-teal); box-shadow: none; }
html body .card li::before { color: var(--so-teal); }
html body .card .case { font-style: normal; color: var(--so-sub); }

/* ---------- 企業牆 ---------- */
html body .logo-tag { border-radius: 4px; box-shadow: none; color: var(--so-ink); }
html body .logo-tag:hover { border-color: var(--so-teal); box-shadow: none; }

/* ---------- 表單 ---------- */
html body .form-card { border-radius: 4px; }
html body .form-card input { border-radius: 4px; border-color: #C7C7CC; }
html body .form-card input:focus { border-color: var(--so-teal); box-shadow: 0 0 0 3px rgba(0,112,138,.15); }

/* 企業 CTA：拿掉漸層框，改霧底＋墨色左線 */
html body .enterprise-cta { background: var(--so-mist); border-radius: 4px; border-left: 4px solid var(--so-ink); }
html body .enterprise-cta::before { display: none; }

/* ---------- 講師 ---------- */
html body .instructor-avatar { border-radius: 4px; box-shadow: none; border: 0; }
html body .instructor .title { color: var(--so-teal); }
html body .instructor-stats strong { color: var(--so-teal); }

/* ---------- 頁尾：章 ---------- */
html body footer::before {
  content: ""; display: block; width: 32px; height: 32px; margin: 0 auto 16px;
  background: url("/assets/autolab-icon-32.svg") center / contain no-repeat;
}
html body .footer-links a:hover { color: var(--so-teal); }

@media (max-width: 760px) {
  html body .hero::before { bottom: 90px; }
  html body .hero::after { width: 48px; height: 48px; right: 16px; bottom: 91.5px; }
}
@media (max-width: 480px) {
  html body .hero .btn-primary { padding: 16px 20px; font-size: 1.05rem; }
}
