/* RAMAKIEN AI TERMINAL — SEO Pages Shared CSS */
*{box-sizing:border-box;margin:0;padding:0}
body{background:#03080f;color:#c8bfb0;font-family:'Sarabun',sans-serif;font-size:16px;line-height:1.85;min-height:100vh}
a{color:#c9920f;text-decoration:none}
a:hover{color:#e8cc6a}
nav{background:rgba(3,8,15,.97);border-bottom:1px solid #1a2a3a;padding:0 28px;display:flex;align-items:center;justify-content:space-between;height:62px;position:sticky;top:0;z-index:100;backdrop-filter:blur(8px)}
.logo{font-family:'Cinzel',serif;color:#e8cc6a;font-size:17px;letter-spacing:.07em;display:flex;align-items:center;gap:4px}
.logo-dot{color:#8b1a1a;font-size:22px;line-height:1}
.nav-links{display:flex;gap:22px;align-items:center;font-size:13px}
.nav-links a{color:#5a7080;transition:color .15s}
.nav-links a:hover{color:#e8cc6a}
.nav-cta{background:linear-gradient(135deg,#c9920f,#e8aa22)!important;color:#000!important;padding:7px 18px;border-radius:8px;font-weight:700}
.hero{background:linear-gradient(160deg,#060d16 0%,#081420 60%,#060d16 100%);border-bottom:1px solid #1a2a3a;padding:84px 28px 68px;text-align:center;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% -20%,rgba(201,146,15,.09),transparent 65%);pointer-events:none}
.badge{display:inline-block;background:rgba(139,26,26,.5);border:1px solid rgba(139,26,26,.45);color:#e8bfbf;font-size:11px;letter-spacing:.14em;padding:5px 16px;border-radius:20px;margin-bottom:20px;font-family:monospace;text-transform:uppercase}
h1{font-family:'Cinzel',serif;color:#e8cc6a;font-size:clamp(26px,5vw,44px);margin-bottom:18px;line-height:1.25;position:relative}
.hero-sub{color:#7a8a9a;font-size:17px;max-width:620px;margin:0 auto 36px;line-height:2}
.cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn-primary{background:linear-gradient(135deg,#c9920f,#e8aa22);color:#000;padding:14px 34px;border-radius:10px;font-weight:700;font-size:15px;display:inline-block;transition:opacity .2s}
.btn-primary:hover{opacity:.85;color:#000}
.btn-secondary{background:transparent;color:#e8cc6a;border:1px solid rgba(201,146,15,.4);padding:13px 28px;border-radius:10px;font-size:15px;display:inline-block;transition:all .2s}
.btn-secondary:hover{border-color:#c9920f;background:rgba(201,146,15,.06);color:#e8cc6a}
main{max-width:880px;margin:0 auto;padding:68px 28px}
section{margin-bottom:64px}
.breadcrumb{font-size:12px;color:#2a3a48;margin-bottom:36px}
.breadcrumb a{color:#2a3a48}
.breadcrumb a:hover{color:#c9920f}
h2{font-family:'Cinzel',serif;color:#c9920f;font-size:20px;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid #1a2a3a;letter-spacing:.05em}
h3{color:#e8cc6a;font-size:15px;font-weight:700;margin:24px 0 9px}
p{margin-bottom:14px;color:#c8bfb0;line-height:1.9}
ul{padding-left:22px;margin-bottom:14px}
li{margin:7px 0;color:#c8bfb0;line-height:1.85}
strong{color:#e8ddd0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:16px;margin-top:20px}
.card{background:#060d16;border:1px solid #1a2a3a;border-radius:12px;padding:24px;transition:border-color .2s}
.card:hover{border-color:rgba(201,146,15,.3)}
.card-icon{font-size:30px;margin-bottom:12px}
.card h3{margin-top:0;font-size:14px}
.card p{font-size:13px;color:#7a8a9a;margin-bottom:0}
.faq{display:flex;flex-direction:column;gap:12px;margin-top:20px}
.faq-item{background:#060d16;border:1px solid #1a2a3a;border-radius:10px;padding:22px 26px}
.faq-q{color:#e8cc6a;font-weight:700;margin-bottom:10px;font-size:15px;line-height:1.55}
.faq-a{color:#9a8878;font-size:14px;line-height:1.85}
.link-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:18px}
.link-card{background:#060d16;border:1px solid #1a2a3a;border-radius:8px;padding:16px 18px;color:#c8bfb0;transition:border-color .2s;display:block}
.link-card:hover{border-color:rgba(201,146,15,.5)}
.link-card strong{display:block;color:#e8cc6a;margin-bottom:4px;font-size:14px}
.link-card span{font-size:12px;color:#4a6070}
.tags{margin:16px 0;display:flex;flex-wrap:wrap;gap:6px}
.tag{background:#0a1828;border:1px solid #1a2a3a;border-radius:4px;font-size:11px;padding:3px 10px;color:#4a6070}
footer{background:#060d16;border-top:1px solid #1a2a3a;padding:48px 28px;text-align:center;color:#2a3a48;font-size:13px;line-height:2.2}
footer a{color:#3a5060}
footer a:hover{color:#c9920f}
.footer-logo{font-family:'Cinzel',serif;color:rgba(201,146,15,.22);font-size:22px;margin-bottom:14px;letter-spacing:.1em}
@media(max-width:680px){nav .nav-links{display:none}.hero{padding:56px 18px 44px}main{padding:44px 18px}h1{font-size:28px}}
