/* ── GoAIPass Shared Styles ────────────────────── */
:root{
  --bg:#f7f8fc;--bg2:#fff;--bg3:#f0f2f8;
  --border:#e2e5ef;--border2:#d0d4e8;
  --text:#1a1d2e;--muted:#7b82a0;--muted2:#9ba3be;
  --accent:#00a878;--accent2:#3b82f6;--accent3:#8b5cf6;
  --danger:#ef4444;--warn:#f59e0b;--safe:#10b981;
  --fu:'Inter',sans-serif;--fm:'JetBrains Mono',monospace;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);color:var(--text);font-family:var(--fu);min-height:100vh;line-height:1.7;}
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.4;
  background-image:radial-gradient(circle,#c8cde0 1px,transparent 1px);background-size:28px 28px;}
.z{position:relative;z-index:1;}

/* ── Header ── */
header{background:rgba(247,248,252,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;}
.h-inner{max-width:980px;margin:0 auto;padding:0 24px;height:58px;display:flex;align-items:center;justify-content:space-between;}

/* ── Logo ── */
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;}
.logo-name{font-family:'Orbitron',sans-serif;font-size:22px;font-weight:900;letter-spacing:0;line-height:1;color:var(--text);display:flex;align-items:center;}
.logo-name .go{color:var(--text);}
.logo-name .ai{color:var(--accent);}
.logo-name .pass{color:var(--text);}

/* ── Nav ── */
.nav a{font-size:13px;font-weight:500;padding:7px 14px;border-radius:8px;color:var(--muted);text-decoration:none;transition:.15s;}
.nav a:hover{color:var(--text);background:var(--bg3);}
.nav a.on{color:var(--accent);background:rgba(0,168,120,.08);}
.back{font-size:13px;font-weight:500;padding:7px 14px;border-radius:8px;color:var(--muted);text-decoration:none;transition:.15s;}
.back:hover{color:var(--text);background:var(--bg3);}

/* ── Footer ── */
footer{background:var(--bg2);border-top:1px solid var(--border);padding:28px 0;margin-top:20px;}
.ft-inner{max-width:980px;margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;}
.ft-copy{color:var(--muted2);font-size:11px;font-family:var(--fm);}
.ft-links{display:flex;gap:18px;}
.ft-links a{color:var(--muted2);font-size:11px;text-decoration:none;transition:.15s;}
.ft-links a:hover{color:var(--accent);}

/* ── Article Layout ── */
.wrap{max-width:860px;margin:0 auto;padding:0 24px;}
.article-wrap{max-width:720px;margin:0 auto;padding:0 24px;}
.page-head{padding:48px 0 28px;border-bottom:1px solid var(--border);margin-bottom:36px;}
.breadcrumb{font-size:11px;font-family:var(--fm);color:var(--muted);margin-bottom:14px;}
.breadcrumb a{color:var(--muted);text-decoration:none;}
.breadcrumb a:hover{color:var(--accent);}
.atag{display:inline-block;font-size:10px;font-family:var(--fm);color:var(--accent);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px;background:rgba(0,168,120,.08);border:1px solid rgba(0,168,120,.2);padding:4px 10px;border-radius:4px;}
h1{font-family:'Inter',sans-serif;font-size:clamp(20px,3.5vw,36px);font-weight:700;line-height:1.2;margin-bottom:16px;color:var(--text);}
.ameta{display:flex;gap:14px;font-size:11px;font-family:var(--fm);color:var(--muted);}

/* ── Article Body ── */
.abody{padding-bottom:60px;}
.abody p{font-size:15px;line-height:1.8;color:#4a5068;margin-bottom:18px;}
.abody h2{font-family:'Inter',sans-serif;font-size:clamp(15px,2vw,19px);font-weight:700;color:var(--text);margin:32px 0 12px;}
.abody h3{font-size:16px;font-weight:600;color:var(--text);margin:24px 0 10px;}
.abody ul,.abody ol{padding-left:20px;margin-bottom:18px;}
.abody li{font-size:15px;line-height:1.8;color:#4a5068;margin-bottom:6px;}
.abody strong{color:var(--text);}
.abody a{color:var(--accent);text-decoration:none;}
.abody a:hover{text-decoration:underline;}

/* ── Blog Tags ── */
.blog-tag{font-size:10px;font-family:var(--fm);letter-spacing:.08em;text-transform:uppercase;font-weight:600;padding:3px 8px;border-radius:6px;}
.tag-guide{color:var(--accent);background:rgba(0,168,120,.08);}
.tag-how{color:#3b82f6;background:rgba(59,130,246,.08);}
.tag-seo{color:#8b5cf6;background:rgba(139,92,246,.08);}
.tag-research{color:#ef4444;background:rgba(239,68,68,.08);}

/* ── CTA ── */
.btn-cta{display:inline-flex;align-items:center;gap:8px;background:#00a878;color:#fff !important;font-size:14px;font-weight:600;padding:12px 26px;border-radius:9px;text-decoration:none !important;transition:.2s;box-shadow:0 2px 8px rgba(0,168,120,.3);}
.btn-cta:hover{background:#008f67;color:#fff !important;transform:translateY(-1px);}
.cta-box{background:linear-gradient(135deg,rgba(0,168,120,.06),rgba(59,130,246,.04));border:1.5px solid rgba(0,168,120,.2);border-radius:14px;padding:28px;text-align:center;margin:36px 0;}
.cta-box h3{font-family:'Inter',sans-serif;font-size:20px;font-weight:700;margin-bottom:10px;color:var(--text);}
.cta-box p{font-size:14px;color:var(--muted);margin-bottom:20px;}

/* ── Callout ── */
.callout{background:rgba(0,168,120,.05);border-left:3px solid var(--accent);border-radius:0 8px 8px 0;padding:14px 18px;margin:22px 0;}
.callout p{margin:0;font-size:14px;}
.callout.warn{border-left-color:#f59e0b;background:rgba(245,158,11,.05);}
.callout.warn p{color:#92400e;}
.callout.info{border-left-color:#3b82f6;background:rgba(59,130,246,.05);}
.callout.info p{color:#1e40af;}

/* ── Step Box ── */
.step-box{background:var(--bg2);border:1px solid var(--border2);border-radius:12px;padding:20px 24px;margin:14px 0;box-shadow:0 1px 3px rgba(0,0,0,.06);}
.step-num{font-size:10px;font-family:var(--fm);color:var(--accent);letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px;}
.step-box h3{font-size:15px;font-weight:600;margin-bottom:8px;color:var(--text);}
.step-box p{font-size:14px;color:var(--muted);line-height:1.7;margin:0;}

@keyframes pulse-btn{0%,100%{box-shadow:0 2px 8px rgba(0,168,120,.3);}50%{box-shadow:0 4px 20px rgba(0,168,120,.55);}}
@keyframes blink-text{0%,100%{opacity:1;}50%{opacity:0.3;}}
.btn-cta{animation:pulse-btn 2.5s ease-in-out infinite;}
.btn-cta .blink{animation:blink-text 1.5s ease-in-out infinite;}
