/* ===========================================================
   彭祖・徐福学院 主题样式 v20260901
   - PC横向导航 + 移动端汉堡
   - 主题色：金 #d4af37 / 暖棕底 #2a2018 / 米白字 #f0ebe0
   =========================================================== */
*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --gold:#d4af37;
  --gold-soft:#a68a4e;
  --bg-deep:#0e0a07;
  --bg-1:#2a2018;
  --bg-2:#1a1410;
  --ink:#f0ebe0;
  --ink-soft:#c8c2b0;
  --ink-mute:#8a7f6a;
  --line:rgba(166,138,78,.35);
  --shadow:0 10px 30px rgba(0,0,0,.4);
}
html,body{height:100%;}
body{
  font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans","Yu Gothic","Noto Sans CJK SC",sans-serif;
  background:radial-gradient(circle at 50% 35%,var(--bg-1) 0%,var(--bg-2) 70%,var(--bg-deep) 100%);
  color:var(--ink);line-height:1.65;letter-spacing:.04em;
  min-height:100vh;min-height:100dvh;
  display:flex;flex-direction:column;
}
a{color:var(--gold);text-decoration:none;transition:color .2s,opacity .2s;}
a:hover{color:#fff;opacity:.92;}
img{max-width:100%;display:block;}

/* ====== Skip to content ====== */
.skip-link{position:absolute;left:-9999px;}
.skip-link:focus{left:1rem;top:1rem;background:var(--gold);color:#000;padding:.5rem 1rem;z-index:1000;}

/* ====== 顶部 Header ====== */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(14,10,7,.85);
  backdrop-filter:saturate(140%) blur(10px);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--line);
}
.site-header-inner{
  max-width:1180px;margin:0 auto;
  display:flex;align-items:center;gap:1.2rem;
  padding:1rem 1.2rem;
}
.brand{display:flex;align-items:center;gap:.6rem;color:var(--ink);}
.brand-mark{
  width:38px;height:38px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #f5e4a8, var(--gold) 60%, #6b5012);
  display:grid;place-items:center;color:#1a1410;
  font-weight:900;font-size:1.05rem;letter-spacing:0;
}
.brand-name{font-weight:600;letter-spacing:.18em;font-size:1.05rem;}
.brand-name small{display:block;font-size:.65rem;color:var(--ink-mute);letter-spacing:.1em;font-weight:400;margin-top:.1rem;}

/* PC nav */
.primary-nav{margin-left:auto;display:flex;gap:.4rem;align-items:center;}
.primary-nav a{
  color:var(--ink-soft);padding:.55rem .9rem;
  border-radius:8px;font-size:.95rem;letter-spacing:.06em;
}
.primary-nav a:hover,.primary-nav a[aria-current="page"]{background:rgba(212,175,55,.12);color:var(--gold);}
.lang-switch{display:flex;gap:.25rem;margin-left:.6rem;}
.lang-switch a{
  font-size:.7rem;letter-spacing:.12em;
  padding:.35rem .55rem;border-radius:6px;border:1px solid var(--line);color:var(--ink-soft);
}
.lang-switch a[aria-current="true"]{background:var(--gold);color:#1a1410;border-color:var(--gold);font-weight:600;}

/* Hamburger (mobile) */
.hamburger{display:none;background:none;border:0;color:var(--ink-soft);font-size:1.6rem;cursor:pointer;padding:.4rem .6rem;}

/* Mobile drawer */
.mobile-drawer{display:none;}

/* ====== Hero ====== */
.hero{
  position:relative;overflow:hidden;
  min-height:42vh;
  background:
    linear-gradient(180deg, rgba(14,10,7,.2) 0%, rgba(14,10,7,.85) 100%),
    radial-gradient(circle at 70% 30%, rgba(212,175,55,.18), transparent 60%),
    var(--bg-1);
}
.hero-inner{
  max-width:1180px;margin:0 auto;padding:3.2rem 1.2rem 2.6rem;
}
.hero h1{font-size:clamp(1.4rem,4.2vw,2.4rem);font-weight:600;color:var(--gold);letter-spacing:.18em;text-shadow:0 2px 14px rgba(0,0,0,.5);margin-bottom:.8rem;}
.hero p{color:var(--ink-soft);max-width:780px;font-size:clamp(.95rem,2.4vw,1.05rem);}
.hero .meta{margin-top:1.2rem;display:flex;flex-wrap:wrap;gap:.6rem;}
.hero .meta span{font-size:.75rem;color:var(--ink-mute);padding:.3rem .7rem;border:1px solid var(--line);border-radius:999px;}

/* ====== Sections ====== */
.section{max-width:1180px;margin:0 auto;padding:2.4rem 1.2rem;}
.section + .section{padding-top:0;}
.section h2{
  font-size:clamp(1.15rem,3vw,1.5rem);color:var(--gold);
  letter-spacing:.18em;margin-bottom:1rem;
  display:flex;align-items:center;gap:.6rem;
}
.section h2::before{content:"";width:6px;height:18px;background:var(--gold);border-radius:3px;}
.section .sub-desc{color:var(--ink-mute);font-size:.85rem;margin-bottom:1.4rem;}

/* Card grid */
.card-grid{display:grid;gap:1rem;}
.card-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.card-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.card-grid.cols-5{grid-template-columns:repeat(5,minmax(0,1fr));}
.card{
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  border-radius:14px;overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .25s, border-color .25s, box-shadow .25s;
}
.card:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:var(--shadow);}
.card .img{aspect-ratio:3/2;background:var(--bg-2) center/cover no-repeat;}
.card .pad{padding:.9rem 1rem 1.1rem;flex:1;display:flex;flex-direction:column;gap:.5rem;}
.card h3{font-size:1.05rem;color:var(--ink);font-weight:600;letter-spacing:.04em;}
.card p{font-size:.85rem;color:var(--ink-mute);flex:1;}
.card .more{margin-top:.6rem;font-size:.78rem;color:var(--gold);}

/* Pill button */
.pill{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.55rem 1.1rem;border-radius:999px;
  background:var(--gold);color:#1a1410;font-weight:600;
  font-size:.85rem;letter-spacing:.08em;
}
.pill:hover{color:#000;opacity:.92;}
.pill.ghost{background:transparent;color:var(--gold);border:1px solid var(--gold);}

/* ====== Accordion (FAQ) ====== */
.accordion{border-top:1px solid var(--line);}
.accordion details{border-bottom:1px solid var(--line);}
.accordion summary{
  list-style:none;cursor:pointer;
  padding:1rem .2rem;
  display:flex;justify-content:space-between;align-items:center;
  font-size:.98rem;color:var(--ink);
}
.accordion summary::-webkit-details-marker{display:none;}
.accordion summary::after{
  content:"＋";color:var(--gold);font-size:1.3rem;font-weight:300;
  transition:transform .2s;
}
.accordion details[open] summary::after{content:"－";}
.accordion .answer{padding:0 .2rem 1.2rem;color:var(--ink-soft);font-size:.92rem;line-height:1.75;}

/* ====== News / Video list ====== */
.list-row{
  display:grid;grid-template-columns:2fr 1fr auto;gap:1rem;
  padding:1rem 0;border-bottom:1px solid var(--line);
  align-items:center;
}
.list-row .date{color:var(--ink-mute);font-size:.8rem;}
.list-row .tag{font-size:.7rem;color:var(--gold);border:1px solid var(--gold);padding:.15rem .5rem;border-radius:4px;letter-spacing:.06em;}

.video-card .img{aspect-ratio:16/9;}
.video-card .pad .play{font-size:.7rem;color:var(--ink-mute);}

/* ====== Form ====== */
.form-grid{display:grid;gap:1rem;max-width:640px;}
.form-grid label{display:block;font-size:.85rem;color:var(--ink-soft);margin-bottom:.35rem;}
.form-grid input,.form-grid textarea,.form-grid select{
  width:100%;background:rgba(255,255,255,.06);color:var(--ink);
  border:1px solid var(--line);border-radius:8px;
  padding:.7rem .9rem;font:inherit;
}
.form-grid input:focus,.form-grid textarea:focus{outline:none;border-color:var(--gold);}
.form-grid textarea{min-height:120px;resize:vertical;}

/* ====== Page hero (sub pages) ====== */
.page-hero{
  background:linear-gradient(180deg,rgba(14,10,7,.4),var(--bg-1));
  border-bottom:1px solid var(--line);
  padding:2rem 1.2rem;
}
.page-hero-inner{max-width:1180px;margin:0 auto;}
.page-hero h1{color:var(--gold);font-size:clamp(1.3rem,3.6vw,1.9rem);letter-spacing:.18em;font-weight:600;}
.page-hero p{color:var(--ink-mute);font-size:.9rem;margin-top:.6rem;}

/* ====== Footer ====== */
.site-footer{
  margin-top:auto;background:rgba(0,0,0,.55);
  border-top:1px solid var(--line);
  padding:1.8rem 1.2rem 1.2rem;
  font-size:.78rem;color:var(--ink-mute);letter-spacing:.04em;
}
.site-footer .inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr;gap:1.4rem;}
.site-footer h4{color:var(--gold);font-size:.85rem;letter-spacing:.14em;margin-bottom:.6rem;}
.site-footer ul{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem .9rem;}
.site-footer a{color:var(--ink-soft);}
.site-footer .copy{border-top:1px solid var(--line);margin-top:1.2rem;padding-top:1rem;text-align:center;}

/* ====== Responsive ====== */
@media (max-width: 960px){
  .primary-nav, .lang-switch{display:none;}
  .hamburger{display:block;}
  .mobile-drawer{
    display:block;position:fixed;inset:64px 0 0 0;z-index:40;
    background:rgba(14,10,7,.97);
    transform:translateX(100%);transition:transform .25s ease;
    overflow-y:auto;
  }
  .mobile-drawer.is-open{transform:translateX(0);}
  .mobile-drawer nav{padding:1rem 1.2rem 4rem;}
  .mobile-drawer a{display:block;color:var(--ink);padding:.95rem 0;border-bottom:1px solid var(--line);font-size:1rem;letter-spacing:.08em;}
  .mobile-drawer .lang-row{display:flex;gap:.5rem;padding:1rem 0;border-bottom:1px solid var(--line);}
  .mobile-drawer .lang-row a{flex:1;text-align:center;border:1px solid var(--line);border-radius:8px;padding:.5rem 0;color:var(--ink-soft);}
  body.menu-open{overflow:hidden;}
}
@media (max-width: 760px){
  .card-grid.cols-2, .card-grid.cols-3, .card-grid.cols-5{grid-template-columns:1fr 1fr;}
  .site-footer .inner{grid-template-columns:1fr;}
}
@media (max-width: 480px){
  .card-grid.cols-2, .card-grid.cols-3, .card-grid.cols-5{grid-template-columns:1fr;}
  .list-row{grid-template-columns:1fr;gap:.4rem;}
  .hero{min-height:32vh;}
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *{transition:none !important;animation:none !important;}
}
