/*
Theme: timezone-china (wcbeijingtime.com)
Layout: Centered-contained, three-column time cards
Grid: Three-column card grid
Font: Noto Sans SC
*/
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Noto Sans SC',-apple-system,BlinkMacSystemFont,sans-serif;background:#fff5f5;color:#212121;line-height:1.7}

/* Header: Breadcrumb top bar + main row */
.header-china{position:sticky;top:0;z-index:100}
.top-bar-breadcrumb{background:#b71c1c;padding:6px 0;font-size:.78rem;color:rgba(255,255,255,.7)}
.breadcrumb-inner{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;gap:8px}
.bc-item{color:rgba(255,255,255,.8)}
.bc-sep{opacity:.4}
.header-main-row{background:linear-gradient(135deg,#b71c1c,#d32f2f);padding:12px 0;display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:0 auto;padding:12px 20px;gap:20px}
.logo-china{display:flex;align-items:center;gap:8px;color:#fff;text-decoration:none}
.logo-cn{font-size:1.5rem}
.logo-cn-text{font-size:1.1rem;font-weight:700;letter-spacing:1px}
.nav-china{display:flex;gap:16px}
.nav-china a{color:rgba(255,255,255,.8);font-size:.88rem;padding:6px 0;border-bottom:2px solid transparent;transition:all .2s}
.nav-china a:hover{color:#ffd600;border-bottom-color:#ffd600}
.search-china-inline{display:flex;align-items:center;gap:6px}
.search-china-input{padding:8px 14px;border-radius:20px;border:none;font-size:.82rem;width:180px;background:rgba(255,255,255,.15);color:#fff;outline:none}
.search-china-input::placeholder{color:rgba(255,255,255,.5)}
.search-china-btn{background:#ffd600;color:#b71c1c;border:none;border-radius:20px;padding:8px 16px;font-size:.82rem;font-weight:700;cursor:pointer}

/* Hero: China-themed with Beijing clock */
.hero-timezone-china{background:linear-gradient(135deg,#d32f2f,#e57373,#ffcdd2);padding:50px 0;text-align:center}
.hero-china{max-width:800px;margin:0 auto;padding:0 20px}
.hero-china-badge{display:inline-block;background:rgba(255,255,255,.2);padding:4px 16px;border-radius:20px;font-size:.8rem;color:#fff;margin-bottom:16px}
.hero-title{font-size:2.2rem;font-weight:900;color:#fff;line-height:1.3;margin-bottom:15px}
.hero-subtitle{font-size:1rem;color:rgba(255,255,255,.85);margin-bottom:24px}
.hero-beijing-clock{margin:24px 0}
.bj-clock-face{display:inline-block;background:rgba(0,0,0,.2);border-radius:16px;padding:20px 40px;backdrop-filter:blur(8px)}
.bj-label{display:block;font-size:.8rem;color:rgba(255,255,255,.6);margin-bottom:6px}
.bj-time{display:block;font-size:2.8rem;font-weight:900;color:#ffd600;font-variant-numeric:tabular-nums;letter-spacing:4px}
.bj-date{display:block;font-size:.82rem;color:rgba(255,255,255,.6);margin-top:4px}
.hero-btn{padding:10px 28px;border-radius:50px;font-weight:700;font-size:.85rem;display:inline-block;margin:6px;transition:all .2s}
.hero-btn-primary{background:#ffd600;color:#b71c1c}
.hero-btn-primary:hover{background:#ffea00;transform:translateY(-2px)}
.hero-btn-outline{border:2px solid #fff;color:#fff;background:transparent}
.hero-btn-outline:hover{background:rgba(255,255,255,.15)}

/* Content: Three-column with full-width modules */
.content-china-three-col{padding:40px 20px;max-width:1200px;margin:0 auto}
.module-full-width{margin-bottom:40px}
.module-full-width h2{font-size:1.4rem;font-weight:700;color:#c62828;margin-bottom:16px;border-bottom:3px solid #c62828;padding-bottom:8px;display:inline-block}

/* Daily schedule */
.daily-schedule-grid{display:flex;flex-direction:column;gap:8px}
.match-item{display:grid;grid-template-columns:100px 1fr 1fr;gap:16px;background:#fff;padding:14px 18px;border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,.06);align-items:center;border-left:4px solid #c62828}
.match-time{font-weight:700;font-size:1.1rem;color:#c62828}
.match-vs{font-weight:600;font-size:.92rem}
.match-venue{font-size:.8rem;color:#9e9e9e;text-align:right}

/* Cards: Three-column red-bordered */
.cards-grid-3col{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.china-card{background:#fff;border-left:4px solid #c62828;border-radius:6px;padding:20px;box-shadow:0 1px 6px rgba(0,0,0,.06);text-align:center}
.card-title-row{font-size:.9rem;font-weight:600;margin-bottom:10px;color:#c62828}
.card-time-big{font-size:2rem;font-weight:900;color:#212121;margin:8px 0}
.card-zone{font-size:.78rem;color:#9e9e9e}

/* City compare */
.city-compare-row{display:flex;gap:16px;align-items:end;flex-wrap:wrap}
.city-input-group{flex:1;min-width:200px}
.city-input-group label{display:block;font-size:.82rem;color:#9e9e9e;margin-bottom:6px}
.city-input-group select,.city-input-group input{padding:10px 14px;border:2px solid #e0e0e0;border-radius:8px;font-size:.9rem;width:100%}
.convert-btn{background:#c62828;color:#fff;border:none;padding:12px 28px;border-radius:8px;font-weight:700;cursor:pointer}

/* Footer */
.footer-china{background:linear-gradient(135deg,#b71c1c,#d32f2f);padding:40px 0;color:rgba(255,255,255,.7)}
.footer-china-top{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;max-width:1200px;margin:0 auto;padding:0 20px}
.footer-china-top h4{font-size:.9rem;font-weight:700;color:#ffd600;margin-bottom:12px}
.footer-china-top a{display:block;color:rgba(255,255,255,.6);margin:6px 0;font-size:.82rem}
.footer-china-divider{height:1px;background:rgba(255,255,255,.15);margin:20px auto;max-width:1200px}
.footer-china-legal{text-align:center;font-size:.78rem;padding:0 20px;line-height:1.6}

@media(max-width:768px){
  .header-main-row{flex-direction:column;align-items:stretch}
  .nav-china{justify-content:center;flex-wrap:wrap}
  .search-china-inline{margin-top:8px;width:100%}
  .search-china-input{flex:1}
  .hero-title{font-size:1.6rem!important}
  .bj-time{font-size:2rem}
  .daily-schedule-grid .match-item{grid-template-columns:1fr;text-align:center}
  .cards-grid-3col{grid-template-columns:1fr}
  .footer-china-top{grid-template-columns:1fr}
}