/*
Theme Name: อ.ณัฐ ซินแสฮวงจุ้ย v7
Theme URI: https://aj.nut.thai-168.com/
Author: Thai-168
Description: Full-bleed hero แบบ "ไม่พึ่งเนื้อหาเพจ" (โค้ดใน front-page.php) + ฮวงจุ้ยครบทุกหน้า + ตั้งหน้าแรก/เมนูอัตโนมัติ
Version: 7.0
Text Domain: anut-fengshui-v7
*/
@import url('https://fonts.googleapis.com/css2?family=Sarabun:wght@300;400;600;800&display=swap');
:root{--gold:#d4af37;--dark:#0f0f0f;--light:#ffffff;--ink:#333;--muted:#777;--bg:#faf9f6}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:'Sarabun',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.65}
img{max-width:100%;display:block}
a{color:var(--gold);text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 18px}
.section{padding:56px 0}
.h-sep{height:2px;background:linear-gradient(90deg,var(--gold),rgba(212,175,55,0));width:120px;margin:10px 0 24px 0;border-radius:2px}

/* Header */
.topbar{background:var(--gold);color:#fff;text-align:center;padding:10px 0;font-weight:800}
.site-header{position:sticky;top:0;background:#111;color:#fff;border-bottom:1px solid #222;z-index:50}
.brand{display:flex;align-items:center;gap:14px;padding:14px 0}
.brand .title{font-weight:800;font-size:1.25rem}
.brand .tag{font-size:.95rem;color:#ddd}
.menu{list-style:none;display:flex;gap:18px;margin:0;padding:0;align-items:center;flex-wrap:wrap}
.menu a{color:#fff;padding:10px 12px;border-radius:10px}
.menu a:hover{background:#1c1c1c}
.btn{display:inline-block;background:var(--gold);color:#fff;padding:12px 18px;border-radius:12px;font-weight:700;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.btn-outline{background:transparent;color:#fff;border:2px solid #fff}

/* Full-bleed hero */
.hero-bleed{position:relative;min-height:72vh;display:flex;align-items:center}
.hero-bleed::before{content:"";position:absolute;inset:0;background-image:var(--hero,url('https://images.unsplash.com/photo-1505691723518-36a5ac3b2d52'));background-size:cover;background-position:center}
.hero-bleed::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.60),rgba(0,0,0,.30))}
.hero-bleed .inner{position:relative;z-index:1;color:#fff}
.hero-bleed h1{font-size:2.9rem;margin:.2rem 0}
.hero-bleed p{max-width:880px}

/* Cards / grid */
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:20px}
.col-3{grid-column:span 3}
.col-4{grid-column:span 4}
.col-6{grid-column:span 6}
.col-12{grid-column:span 12}
@media(max-width:920px){.col-3,.col-4,.col-6{grid-column:span 12}}
.card{background:#fff;border:1px solid #eee;border-radius:16px;padding:18px;box-shadow:0 4px 16px rgba(0,0,0,.06);transition:.2s}
.card:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,0,0,.12)}
.kicker{letter-spacing:.12em;text-transform:uppercase;font-size:.75rem;color:#9a7f2f;font-weight:700}
.lead{font-size:1.08rem;color:#e9e9e9}
.list{margin:0;padding-left:18px}
.callout{background:#fff7db;border:1px solid #ffe29a;padding:14px;border-radius:12px}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border:1px solid #eee;padding:10px;text-align:left}
.table th{background:#fff6d5}

/* Footer */
.site-footer{background:#0c0c0c;color:#eee;padding:26px 0;margin-top:0}
.site-footer a{color:#fff}

/* Floating LINE */
.floating-line{position:fixed;right:18px;bottom:20px;background:#06c755;color:#fff;padding:12px 16px;border-radius:999px;font-weight:700;box-shadow:0 2px 10px rgba(0,0,0,.25);z-index:9999}
small, .small{font-size:.92rem;color:#666}