/* TechPulse HK - Main Stylesheet */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#0d1117;--bg2:#161b22;--card:#1c2128;--border:#30363d;
  --text:#e6edf3;--text2:#8b949e;--text3:#6e7681;
  --blue:#58a6ff;--green:#3fb950;--amber:#ffa657;--pink:#f778ba;--purple:#a371f7;
}
body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.6;min-height:100vh}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%}

/* HEADER */
header{background:var(--bg2);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}
.header-inner{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between;height:60px}
.logo{display:flex;flex-direction:column;line-height:1.1;text-decoration:none!important}
.logo-en{font-size:1.2rem;font-weight:700;color:var(--text);letter-spacing:-0.02em}
.logo-zh{font-size:0.68rem;color:var(--text2);letter-spacing:0.08em}
nav{display:flex;gap:2px;align-items:center;flex-wrap:wrap}
nav a{padding:5px 10px;border-radius:6px;color:var(--text2);font-size:0.88rem;transition:all .15s;white-space:nowrap}
nav a:hover,nav a.active{background:var(--card);color:var(--text);text-decoration:none}
.dot{width:6px;height:6px;border-radius:50%;display:inline-block;margin-right:4px;vertical-align:middle}

/* BADGES */
.badge{display:inline-block;padding:2px 9px;border-radius:20px;font-size:0.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.badge-ai{background:rgba(63,185,80,.15);color:var(--green)}
.badge-tech{background:rgba(88,166,255,.15);color:var(--blue)}
.badge-cars{background:rgba(255,166,87,.15);color:var(--amber)}
.badge-watches{background:rgba(247,120,186,.15);color:var(--pink)}
.badge-features{background:rgba(163,113,247,.15);color:var(--purple)}
.cat-ai{color:var(--green)}.cat-tech{color:var(--blue)}.cat-cars{color:var(--amber)}.cat-watches{color:var(--pink)}.cat-features{color:var(--purple)}

/* LAYOUT */
.container{max-width:1200px;margin:0 auto;padding:0 20px}
main{padding:28px 0 60px}

/* HERO */
.hero{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:36px 40px;margin-bottom:36px;position:relative;overflow:hidden}
.hero::after{content:'';position:absolute;top:0;right:0;width:300px;height:100%;background:linear-gradient(135deg,transparent 40%,rgba(88,166,255,.04));pointer-events:none}
.hero .meta{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.hero h1{font-size:1.9rem;font-weight:700;line-height:1.3;margin-bottom:6px}
.hero .title-zh{font-size:1.05rem;color:var(--text2);margin-bottom:14px}
.hero .summary{color:var(--text2);font-size:.97rem;max-width:680px;margin-bottom:18px;line-height:1.65}
.btn{display:inline-block;padding:7px 16px;background:var(--blue);color:#fff!important;border-radius:6px;font-size:.88rem;font-weight:500;transition:opacity .15s;text-decoration:none!important}
.btn:hover{opacity:.82}
.meta-date{font-size:.8rem;color:var(--text3)}

/* SECTION */
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.section-title{font-size:1rem;font-weight:600}
.see-all{font-size:.82rem;color:var(--blue)}

/* ARTICLE GRID */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:36px}
.card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:18px;display:flex;flex-direction:column;transition:border-color .15s,transform .15s;border-left:3px solid transparent}
.card:hover{transform:translateY(-2px);text-decoration:none}
.card.ai{border-left-color:var(--green)}.card.tech{border-left-color:var(--blue)}
.card.cars{border-left-color:var(--amber)}.card.watches{border-left-color:var(--pink)}.card.features{border-left-color:var(--purple)}
.card .meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.card h2{font-size:.97rem;font-weight:600;line-height:1.4;margin-bottom:4px;color:var(--text)}
.card .title-zh{font-size:.83rem;color:var(--text2);margin-bottom:9px;line-height:1.4}
.card p{font-size:.85rem;color:var(--text2);line-height:1.55;flex:1;margin-bottom:12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .read-more{font-size:.82rem;color:var(--blue);align-self:flex-start;margin-top:auto}

/* CATEGORY TILES */
.cat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:36px}
.cat-tile{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:14px;text-align:center;transition:all .15s;text-decoration:none!important;display:block}
.cat-tile:hover{transform:translateY(-2px);text-decoration:none}
.cat-icon{font-size:1.4rem;margin-bottom:5px}
.cat-name-en{font-size:.88rem;font-weight:600;color:var(--text);display:block}
.cat-name-zh{font-size:.73rem;color:var(--text2);display:block}

/* ARTICLE PAGE */
.article-wrap{max-width:800px;margin:0 auto;padding:28px 20px 60px}
.breadcrumb{font-size:.82rem;color:var(--text2);margin-bottom:18px}
.breadcrumb a{color:var(--blue)}
.article-meta{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.article-date{font-size:.82rem;color:var(--text3)}
.article-title{font-size:1.85rem;font-weight:700;line-height:1.33;margin-bottom:8px}
.article-title-zh{font-size:1.1rem;color:var(--text2);margin-bottom:0}
.article-divider{border:none;border-top:1px solid var(--border);margin:26px 0}
.article-body h3{font-size:1.15rem;font-weight:600;margin:22px 0 10px;color:var(--text)}
.article-body p{color:var(--text2);margin-bottom:14px;line-height:1.75;font-size:.97rem}
.zh-section{margin-top:36px;padding-top:28px;border-top:2px dashed var(--border)}
.lang-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--text3);margin-bottom:14px;font-weight:600}
.related{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:22px;margin-top:36px}
.related h3{font-size:.97rem;font-weight:600;margin-bottom:14px}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.related-item .rt{color:var(--text);font-weight:500;font-size:.85rem;line-height:1.4;display:block;margin-bottom:2px}
.related-item .rd{color:var(--text3);font-size:.75rem}

/* CATEGORY PAGE */
.cat-header{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:22px 28px;margin-bottom:28px}
.cat-header h1{font-size:1.5rem;font-weight:700;margin-bottom:3px}
.cat-header p{color:var(--text2);font-size:.93rem}

/* SEARCH */
.search-bar{display:flex;gap:10px;margin-bottom:26px}
.search-input{flex:1;background:var(--card);border:1px solid var(--border);border-radius:8px;padding:9px 14px;color:var(--text);font-size:.93rem;outline:none}
.search-input:focus{border-color:var(--blue)}
.search-btn{background:var(--blue);color:#fff;border:none;border-radius:8px;padding:9px 18px;font-size:.93rem;cursor:pointer;font-weight:500}
#search-results{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
#no-results{color:var(--text2);display:none;padding:20px 0}

/* TEXT PAGES */
.text-page{max-width:800px;margin:0 auto;padding:28px 20px 60px}
.text-page h1{font-size:1.7rem;font-weight:700;margin-bottom:8px}
.page-subtitle{color:var(--text2);margin-bottom:28px;font-size:.95rem}
.text-page h2{font-size:1.1rem;font-weight:600;margin:24px 0 8px;color:var(--text)}
.text-page p,.text-page li{color:var(--text2);margin-bottom:12px;line-height:1.7;font-size:.95rem}
.text-page ul{padding-left:22px;margin-bottom:12px}
.contact-form{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:28px;margin-top:18px}
.form-group{margin-bottom:16px}
.form-label{display:block;font-size:.88rem;color:var(--text2);margin-bottom:5px}
.form-input,.form-textarea{width:100%;background:var(--card);border:1px solid var(--border);border-radius:8px;padding:9px 13px;color:var(--text);font-size:.93rem;outline:none;font-family:inherit}
.form-input:focus,.form-textarea:focus{border-color:var(--blue)}
.form-textarea{min-height:110px;resize:vertical}
.form-submit{background:var(--blue);color:#fff;border:none;border-radius:8px;padding:9px 22px;font-size:.93rem;cursor:pointer;font-weight:500}
.form-submit:hover{opacity:.85}
.info-box{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:16px 20px;margin-bottom:20px}
.info-box p{margin:0;color:var(--text2);font-size:.9rem}

/* FOOTER */
footer{background:var(--bg2);border-top:1px solid var(--border);padding:28px 0 18px}
.footer-inner{max-width:1200px;margin:0 auto;padding:0 20px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:28px;margin-bottom:20px}
.footer-brand .fn{font-size:1.05rem;font-weight:700;color:var(--text);margin-bottom:2px}
.footer-brand .fz{font-size:.75rem;color:var(--text2);margin-bottom:8px}
.footer-brand p{font-size:.82rem;color:var(--text2);line-height:1.6;max-width:240px}
.footer-col h4{font-size:.87rem;font-weight:600;margin-bottom:10px;color:var(--text)}
.footer-col a{display:block;font-size:.82rem;color:var(--text2);margin-bottom:7px;transition:color .15s}
.footer-col a:hover{color:var(--text);text-decoration:none}
.footer-bottom{border-top:1px solid var(--border);padding-top:14px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.footer-bottom p{font-size:.77rem;color:var(--text3)}
.update-badge{font-size:.72rem;color:var(--green);background:rgba(63,185,80,.1);padding:2px 8px;border-radius:20px}

/* RESPONSIVE */
@media(max-width:900px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .cat-grid{grid-template-columns:repeat(3,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .related-grid{grid-template-columns:1fr 1fr}
  #search-results{grid-template-columns:repeat(2,1fr)}
  .hero h1{font-size:1.5rem}
}
@media(max-width:600px){
  .grid{grid-template-columns:1fr}
  .cat-grid{grid-template-columns:repeat(2,1fr)}
  nav a span.nav-label{display:none}
  .hero{padding:24px}
  .hero h1{font-size:1.3rem}
  .article-title{font-size:1.4rem}
  .footer-grid{grid-template-columns:1fr}
  #search-results{grid-template-columns:1fr}
  .related-grid{grid-template-columns:1fr}
}

.badge-space{background:rgba(121,192,255,.15);color:#79c0ff}
.badge-headlines{background:rgba(255,158,100,.15);color:#ff9e64}
.cat-space{color:#79c0ff}.cat-headlines{color:#ff9e64}

/* LANGUAGE SWITCHER */
.lang-switcher { display: flex; align-items: center; gap: 2px; margin-left: 8px; border-left: 1px solid var(--border); padding-left: 10px; }
.lang-switcher a { padding: 4px 8px; border-radius: 6px; color: var(--text2); font-size: 0.82rem; font-weight: 500; white-space: nowrap; }
.lang-switcher a:hover { background: var(--card); color: var(--text); text-decoration: none; }
.lang-switcher a.active { color: var(--text); background: var(--card); }
.lang-switcher-mobile { display: none; }
@media(max-width:700px) {
  .lang-switcher { display: none; }
  .lang-switcher-mobile { display: flex; gap: 6px; padding: 6px 16px 8px; border-top: 1px solid var(--border); background: var(--bg2); }
  .lang-switcher-mobile a { padding: 3px 10px; border-radius: 6px; color: var(--text2); font-size: 0.82rem; font-weight: 500; }
  .lang-switcher-mobile a:hover, .lang-switcher-mobile a.active { background: var(--card); color: var(--text); text-decoration: none; }
}