/*
Theme Name: Minimal Bet TH
Theme URI: https://example.com/minimal-bet-th
Author: Developer
Description: Ultra-clean minimal design theme with teal accent for Thai sports betting
Version: 1.0
Text Domain: minimal-bet-th
*/
@import url('https://fonts.googleapis.com/css2?family=Prompt:wght@300;400;500;600;700&display=swap');
:root{--bg:#fafafa;--bg-white:#ffffff;--accent:#009688;--accent-light:#e0f2f1;--text-dark:#263238;--text-gray:#607d8b;--border:#e0e0e0;--font-main:'Prompt',sans-serif}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:var(--font-main);background:var(--bg);color:var(--text-dark);line-height:1.7;font-weight:300}
a{color:var(--accent);text-decoration:none;transition:opacity .3s}a:hover{opacity:.7}
.container{max-width:1100px;margin:0 auto;padding:0 24px}
.site-header{background:var(--bg-white);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:1000}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:20px 0}
.site-logo{font-size:1.2rem;font-weight:600;color:var(--text-dark);letter-spacing:-.5px}
.site-logo span{color:var(--accent)}
.main-nav ul{display:flex;list-style:none;gap:30px}
.main-nav a{color:var(--text-gray);font-size:.85rem;font-weight:400;transition:color .3s}
.main-nav a:hover{color:var(--accent)}
.mobile-toggle{display:none;background:none;border:none;color:var(--text-dark);font-size:1.3rem;cursor:pointer}
.hero-minimal{padding:120px 0 80px;text-align:center}
.hero-minimal h1{font-size:2.8rem;font-weight:700;color:var(--text-dark);line-height:1.2;margin-bottom:20px;letter-spacing:-1px}
.hero-minimal p{font-size:1.1rem;color:var(--text-gray);max-width:500px;margin:0 auto 35px;font-weight:300}
.hero-btn{display:inline-block;padding:12px 32px;background:var(--accent);color:#fff;border-radius:4px;font-size:.9rem;font-weight:500;transition:all .3s}
.hero-btn:hover{opacity:.85;color:#fff;transform:translateY(-1px)}
.features-row{padding:60px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px;text-align:center}
.feature-item{padding:20px}
.feature-icon{font-size:2rem;margin-bottom:12px;display:block}
.feature-title{font-size:.95rem;font-weight:600;margin-bottom:8px}
.feature-desc{font-size:.82rem;color:var(--text-gray);line-height:1.6}
.card-section{padding:60px 0}
.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}
.section-title{font-size:1.3rem;font-weight:600;color:var(--text-dark)}
.section-title span{color:var(--accent)}
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}
.card{background:var(--bg-white);border:1px solid var(--border);border-radius:6px;overflow:hidden;transition:all .3s}
.card:hover{border-color:var(--accent);box-shadow:0 2px 12px rgba(0,150,136,.08)}
.card-thumb{width:100%;height:180px;background:var(--accent-light);overflow:hidden}
.card-thumb img{width:100%;height:100%;object-fit:cover}
.card-body{padding:20px}
.card-date{font-size:.75rem;color:var(--accent);margin-bottom:8px;font-weight:500}
.card-title{font-size:.95rem;font-weight:500;margin-bottom:8px;line-height:1.4}
.card-title a{color:var(--text-dark)}.card-title a:hover{color:var(--accent)}
.card-excerpt{font-size:.82rem;color:var(--text-gray);line-height:1.6}
.cta-section{padding:80px 0;text-align:center;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.cta-section h2{font-size:1.5rem;font-weight:600;margin-bottom:12px}
.cta-section p{color:var(--text-gray);margin-bottom:25px;font-size:.95rem}
.site-footer{background:var(--bg-white);border-top:1px solid var(--border);padding:40px 0 20px}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:30px;margin-bottom:30px}
.footer-col h4{font-size:.85rem;font-weight:600;margin-bottom:12px;color:var(--text-dark)}
.footer-col ul{list-style:none}.footer-col li{margin-bottom:6px}
.footer-col a{color:var(--text-gray);font-size:.8rem}.footer-col a:hover{color:var(--accent)}
.footer-bottom{border-top:1px solid var(--border);padding-top:20px;text-align:center;color:var(--text-gray);font-size:.75rem}
.pagination{display:flex;justify-content:center;gap:6px;padding:40px 0}
.pagination a,.pagination span{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:4px;border:1px solid var(--border);color:var(--text-dark);font-size:.85rem;transition:all .3s}
.pagination a:hover,.pagination .current{background:var(--accent);border-color:var(--accent);color:#fff}
.single-article{padding:60px 0;max-width:720px;margin:0 auto}
.article-header{margin-bottom:30px;text-align:center}
.article-title{font-size:1.8rem;font-weight:700;line-height:1.3;margin-bottom:12px}
.article-meta{display:flex;justify-content:center;gap:20px;color:var(--text-gray);font-size:.82rem}
.article-featured-img{width:100%;border-radius:6px;margin-bottom:30px;overflow:hidden}
.article-featured-img img{width:100%;height:auto;display:block}
.article-content{font-size:.95rem;line-height:1.9;color:var(--text-dark)}
.article-content p{margin-bottom:1.5em}
.article-content h2,.article-content h3{margin:2em 0 1em;font-weight:600}
.post-navigation{display:flex;justify-content:space-between;gap:20px;margin-top:50px;padding-top:30px;border-top:1px solid var(--border)}
.post-navigation a{padding:12px 20px;border:1px solid var(--border);border-radius:4px;font-size:.85rem;flex:1;text-align:center;color:var(--text-dark)}
.post-navigation a:hover{border-color:var(--accent);color:var(--accent)}
.related-posts{padding:60px 0;max-width:720px;margin:0 auto}
.related-posts h3{font-size:1.2rem;font-weight:600;margin-bottom:25px}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}
.news-section{padding:60px 0}
@media(max-width:768px){
.main-nav{display:none;position:absolute;top:100%;left:0;width:100%;background:var(--bg-white);padding:20px;border-bottom:1px solid var(--border)}
.main-nav.active{display:block}.main-nav ul{flex-direction:column;gap:12px}
.mobile-toggle{display:block}.hero-minimal h1{font-size:1.8rem}
.hero-minimal{padding:60px 0 40px}.features-row{grid-template-columns:repeat(2,1fr);gap:20px}
.card-grid{grid-template-columns:1fr}.article-title{font-size:1.4rem}
.post-navigation{flex-direction:column}.single-article{padding:30px 20px}}
@media(max-width:480px){.features-row{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}}