/* 鄧強國中數學｜自製樣式，對齊 2026-08-31 前台快照，未使用任何授權主題程式碼 */
:root{
  --brand:#FF914D; --brand-dark:#F07A32;
  --bg:#FAFBFD; --card:#FFFFFF; --border:#D6D9DD;
  --text:#303030; --text-soft:#6B7280;
  --radius:14px; --shell:1220px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);
  font-family:"Noto Sans TC",-apple-system,"PingFang TC","Microsoft JhengHei",sans-serif;
  -webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.shell{max-width:var(--shell);margin:0 auto;padding:0 20px}

/* header */
.site-header{background:#fff;border-bottom:1px solid #ECEEF1;position:sticky;top:0;z-index:50}
.hd{display:flex;align-items:center;gap:28px;height:76px}
.logo img{height:56px;display:block}
.nav{display:flex;align-items:center;gap:6px;flex:1}
.nav a{width:56px;height:76px;display:flex;align-items:center;justify-content:center;
  color:var(--brand);border-bottom:3px solid transparent;transition:.15s}
.nav a:hover{background:#FFF7F1}
.nav a.active{border-bottom-color:var(--brand)}
.nav svg{width:24px;height:24px;fill:currentColor}
.auth{display:flex;align-items:center;gap:14px}
.auth .login{color:var(--text);font-size:15px}
.auth .login:hover{color:var(--brand)}
.btn-reg{background:var(--brand);color:#fff;padding:9px 22px;border-radius:8px;font-size:15px;
  border:0;cursor:pointer;transition:.15s}
.btn-reg:hover{background:var(--brand-dark)}

/* hero */
.hero{margin:0 auto;max-width:var(--shell);padding:0 20px}
.hero-inner{margin-top:0;border-radius:0 0 var(--radius) var(--radius);overflow:hidden;background:#E9EDF0}
.hero-inner img{width:100%;display:block}

/* 課程卡 */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:26px 0 60px}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  overflow:hidden;transition:.18s;display:block}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(28,36,52,.10);border-color:#C7CCD3}
.card img{width:100%;display:block;aspect-ratio:768/510;object-fit:cover}

/* footer */
.site-footer{border-top:1px solid #ECEEF1;background:#fff;padding:26px 0;color:var(--text-soft);font-size:14px}

@media (max-width:1024px){ .grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){
  .hd{height:64px;gap:12px}
  .logo img{height:34px}
  .nav a{width:46px;height:64px}
  .grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .auth .login{font-size:14px}
  .btn-reg{padding:8px 16px;font-size:14px}
}