/*
Theme Name: Embrace 和 — China Mission Art
Theme URI: https://chinamissionart.org
Author: China Mission Art
Author URI: https://chinamissionart.org
Description: Bilingual (EN/中文) exhibition and academic-forum theme for "Embrace 和 — Manifestations of Mission in Chinese Art." Reproduces the chinamissionart.org design with the in-page language toggle, artwork lightbox + catalogue metadata, speaker profiles, and event gallery.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: embrace-he
*/

/* Embrace 和 — Manifestations of Mission in Chinese Art
   chinamissionart.org */

:root{
  --ink:#1c1a17;
  --ink-soft:#36322c;
  --paper:#f7f3ea;
  --paper-2:#efe8d8;
  --cream:#fbf8f1;
  --gold:#a9853f;
  --gold-deep:#8a6a2c;
  --vermilion:#9c3024;
  --line:#d9cfba;
  --muted:#6f685c;
  --maxw:1180px;
  --serif:"Cormorant Garamond","Noto Serif SC",Georgia,"Songti SC",serif;
  --serif-zh:"Noto Serif SC","Songti SC",STSong,serif;
  --sans:"Inter","Noto Sans SC","Helvetica Neue",Arial,"PingFang SC",sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;color:var(--ink);background:var(--paper);
  font-family:var(--sans);font-size:17px;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:var(--gold-deep);text-decoration:none;}
a:hover{color:var(--vermilion);}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}

/* language visibility */
.zh{font-family:var(--serif-zh);}
body.lang-en .zh{display:none;}
body.lang-zh .en{display:none;}
body.lang-en .only-zh{display:none;}
body.lang-zh .only-en{display:none;}

/* ---------- header / nav ---------- */
header.site{
  position:sticky;top:0;z-index:50;
  background:rgba(247,243,234,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px;}
.brand{display:flex;align-items:center;gap:.5rem;font-family:var(--serif);text-decoration:none;}
.brand .he{font-family:var(--serif-zh);font-size:1.7rem;color:var(--vermilion);font-weight:600;line-height:1;}
.brand .en-name{font-size:1.15rem;letter-spacing:.06em;color:var(--ink);font-weight:600;}
/* new wordmark logo: China 和 mission art */
.logo{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--serif);text-decoration:none;}
.logo .lw{font-size:1.4rem;letter-spacing:.04em;color:var(--ink);font-weight:600;line-height:1;}
.logo .lw.art{color:var(--gold-deep);}
.logo .seal{display:inline-flex;align-items:center;justify-content:center;width:1.95rem;height:1.95rem;
  background:var(--vermilion);color:#fff;font-family:var(--serif-zh);font-size:1.3rem;font-weight:600;border-radius:5px;
  box-shadow:0 1px 0 rgba(0,0,0,.15);}
@media(max-width:520px){ .logo .lw{font-size:1.15rem;} .logo .seal{width:1.7rem;height:1.7rem;font-size:1.1rem;} }
.navlinks{display:flex;align-items:center;gap:1.6rem;}
.navlinks a{font-family:var(--serif);font-size:1.05rem;color:var(--ink-soft);letter-spacing:.02em;}
.navlinks a.active,.navlinks a:hover{color:var(--vermilion);}
.langtoggle{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;}
.langtoggle button{
  background:transparent;border:0;padding:.3rem .7rem;cursor:pointer;
  font-family:var(--sans);font-size:.8rem;color:var(--muted);
}
.langtoggle button.on{background:var(--ink);color:var(--cream);}
.menubtn{display:none;background:none;border:0;font-size:1.5rem;cursor:pointer;color:var(--ink);}

/* ---------- hero ---------- */
.hero{position:relative;min-height:78vh;display:flex;align-items:center;
  background:linear-gradient(rgba(20,18,15,.55),rgba(20,18,15,.62)),var(--hero,#222) center/cover no-repeat;
  color:var(--cream);text-align:center;}
.hero .inner{max-width:860px;margin:0 auto;padding:80px 24px;}
.hero .he-big{font-family:var(--serif-zh);font-size:clamp(3rem,9vw,6rem);color:#fff;font-weight:600;line-height:1;margin:0;}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(1.6rem,4.2vw,2.7rem);margin:.6rem 0 .2rem;letter-spacing:.02em;}
.hero .sub-zh{font-family:var(--serif-zh);font-size:clamp(1.1rem,2.6vw,1.5rem);opacity:.92;}
.hero .meta{margin-top:1.8rem;font-size:.95rem;letter-spacing:.08em;text-transform:uppercase;opacity:.85;}
.hero .cta{margin-top:2rem;display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;}
.btn{display:inline-block;padding:.8rem 1.6rem;border-radius:2px;font-family:var(--serif);font-size:1.05rem;
  letter-spacing:.04em;border:1px solid var(--cream);color:var(--cream);transition:.2s;}
.btn:hover{background:var(--cream);color:var(--ink);}
.btn.solid{background:var(--vermilion);border-color:var(--vermilion);color:#fff;}
.btn.solid:hover{background:#7e251b;border-color:#7e251b;color:#fff;}

/* ---------- sections ---------- */
section.band{padding:78px 0;}
section.band.alt{background:var(--cream);}
.eyebrow{font-family:var(--sans);font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 .6rem;}
h2.sec{font-family:var(--serif);font-weight:600;font-size:clamp(1.9rem,4vw,2.7rem);margin:0 0 .3rem;line-height:1.15;}
h2.sec .zh{display:block;font-size:.62em;color:var(--ink-soft);font-weight:500;margin-top:.2rem;}
.lead{font-size:1.12rem;color:var(--ink-soft);max-width:760px;}
.lead .zh{display:block;margin-top:.7rem;color:var(--muted);}
.rule{width:54px;height:3px;background:var(--gold);margin:0 0 1.5rem;}
.center{text-align:center;}
.center .rule{margin-left:auto;margin-right:auto;}
.center .lead{margin-left:auto;margin-right:auto;}

/* section intro grid (home four sections) */
.fourgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem;margin-top:2.5rem;}
.fcard{background:var(--cream);border:1px solid var(--line);padding:1.6rem 1.5rem;border-radius:4px;display:flex;flex-direction:column;}
.fcard .num{font-family:var(--serif);color:var(--gold);font-size:1.1rem;letter-spacing:.2em;}
.fcard h3{font-family:var(--serif);font-size:1.45rem;margin:.4rem 0 .1rem;font-weight:600;}
.fcard h3 .zh{display:block;font-size:.78em;color:var(--ink-soft);font-weight:500;}
.fcard p{color:var(--muted);font-size:.98rem;margin:.5rem 0 0;}
.fcard .yr{margin-top:auto;padding-top:1rem;font-size:.82rem;letter-spacing:.06em;color:var(--gold-deep);text-transform:uppercase;}

/* ---------- exhibit sections ---------- */
.exhibit-sec{padding:70px 0;border-top:1px solid var(--line);}
.exhibit-sec:first-of-type{border-top:0;}
.sec-head{max-width:820px;}
.sec-head .period{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);}
.sec-desc{color:var(--ink-soft);margin-top:.8rem;}
.sec-desc .zh{display:block;margin-top:.6rem;color:var(--muted);}
.source-note{margin-top:1.1rem;padding:.9rem 1.1rem;background:var(--paper-2);border-left:3px solid var(--gold);font-size:.9rem;color:var(--ink-soft);border-radius:0 3px 3px 0;}
.source-note strong{font-family:var(--serif);letter-spacing:.04em;}
.source-note .zh{display:block;margin-top:.35rem;color:var(--muted);}

.artgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.3rem;margin-top:2.2rem;}
.art{background:var(--cream);border:1px solid var(--line);border-radius:3px;overflow:hidden;cursor:pointer;transition:.2s;display:flex;flex-direction:column;}
.art:hover{box-shadow:0 8px 26px rgba(28,26,23,.14);transform:translateY(-3px);}
.art .frame{background:#e9e1cf;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.art .frame img{width:100%;height:100%;object-fit:cover;}
.art .cap{padding:.7rem .8rem .85rem;}
.art .cap .t-en{font-family:var(--serif);font-size:1rem;line-height:1.25;color:var(--ink);}
.art .cap .t-zh{font-family:var(--serif-zh);font-size:.86rem;color:var(--muted);margin-top:.2rem;display:block;}

/* ---------- speakers / forum ---------- */
.speakers{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6rem;margin-top:2.4rem;}
.spk{background:var(--cream);border:1px solid var(--line);border-radius:4px;padding:1.6rem;display:flex;gap:1.3rem;}
.spk .pic{flex:0 0 92px;width:92px;height:92px;border-radius:50%;overflow:hidden;background:var(--ink);
  display:flex;align-items:center;justify-content:center;color:var(--cream);font-family:var(--serif);font-size:1.9rem;
  border:2px solid var(--gold);}
.spk .pic img{width:100%;height:100%;object-fit:cover;}
.spk .body{flex:1;min-width:0;}
.spk .role{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);}
.spk h3{font-family:var(--serif);font-size:1.4rem;margin:.25rem 0 0;font-weight:600;}
.spk h3 .zh{font-size:.8em;color:var(--ink-soft);margin-left:.5rem;font-weight:500;}
.spk .aff{font-size:.92rem;color:var(--muted);margin:.25rem 0 .7rem;font-style:italic;}
.spk .talk{font-size:.98rem;color:var(--ink-soft);}
.spk .talk .zh{display:block;margin-top:.45rem;color:var(--muted);}
.spk .bio{font-size:.92rem;color:var(--muted);margin-top:.6rem;}

/* ---------- gallery ---------- */
.masonry{columns:4;column-gap:14px;margin-top:2.2rem;}
.masonry .g{break-inside:avoid;margin-bottom:14px;cursor:pointer;border-radius:3px;overflow:hidden;border:1px solid var(--line);}
.masonry .g img{width:100%;transition:.3s;}
.masonry .g:hover img{transform:scale(1.04);}

/* program list */
.program{margin-top:2rem;border-top:1px solid var(--line);}
.prow{display:flex;gap:1.5rem;padding:1rem 0;border-bottom:1px solid var(--line);}
.prow .time{flex:0 0 130px;font-family:var(--serif);color:var(--gold-deep);font-size:1.02rem;}
.prow .what{flex:1;}
.prow .what .t{font-family:var(--serif);font-size:1.12rem;}
.prow .what .t .zh{font-size:.85em;color:var(--muted);margin-left:.4rem;}
.prow .what .d{font-size:.92rem;color:var(--muted);margin-top:.15rem;}

/* committee */
.committee{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:2.2rem;}
.col h4{font-family:var(--serif);font-size:1.2rem;border-bottom:2px solid var(--gold);padding-bottom:.4rem;margin:0 0 .7rem;}
.col ul{list-style:none;margin:0;padding:0;}
.col li{padding:.3rem 0;color:var(--ink-soft);font-size:.96rem;}

/* ---------- lightbox ---------- */
.lb{position:fixed;inset:0;background:rgba(18,16,13,.95);display:none;align-items:center;justify-content:center;z-index:100;flex-direction:column;overflow-y:auto;padding:48px 16px;}
.lb.on{display:flex;}
.lb img{max-width:88vw;max-height:60vh;object-fit:contain;box-shadow:0 10px 50px rgba(0,0,0,.6);flex:0 0 auto;}
.lb .lbcap{color:var(--cream);text-align:center;margin-top:1.1rem;max-width:680px;font-family:var(--serif);}
.lb .lb-title{display:block;font-size:1.45rem;line-height:1.2;}
.lb .lb-title.zh{font-size:1.15rem;opacity:.82;margin-top:.15rem;}
.lb .lb-desc{display:block;font-family:var(--sans);font-size:.92rem;line-height:1.55;color:#d8cfbb;margin:.8rem auto 0;max-width:600px;}
.lb .lb-desc .zh{display:block;margin-top:.35rem;opacity:.85;}
.lb-meta{font-family:var(--sans);font-size:.84rem;text-align:left;max-width:560px;margin:1.1rem auto 0;
  display:grid;grid-template-columns:auto 1fr;gap:.3rem 1rem;border-top:1px solid rgba(255,255,255,.16);padding-top:.9rem;}
.lb-meta dt{color:#a99e86;white-space:nowrap;}
.lb-meta dd{margin:0;color:#ece4d3;}
.lb-meta dt .zh,.lb-meta dd .zh{display:block;}
.lb-meta dd a{color:var(--gold);text-decoration:underline;}
.lb-record{display:inline-block;margin-top:1rem;font-family:var(--sans);font-size:.85rem;color:var(--gold);border:1px solid var(--gold);padding:.4rem .9rem;border-radius:3px;}
.lb-record:hover{background:var(--gold);color:var(--ink);}
.spk-link{display:inline-block;margin-top:.7rem;font-family:var(--sans);font-size:.85rem;color:var(--gold-deep);border-bottom:1px solid var(--gold);padding-bottom:1px;}
.spk-link:hover{color:var(--vermilion);}
.lb .close{position:fixed;top:18px;right:26px;color:#fff;font-size:2rem;cursor:pointer;background:none;border:0;z-index:2;}
.lb .arrow{position:fixed;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.1);border:0;color:#fff;font-size:2rem;padding:.4rem .9rem;cursor:pointer;border-radius:3px;z-index:2;}
.lb .arrow:hover{background:rgba(255,255,255,.25);}
.lb .prev{left:24px;}.lb .next{right:24px;}

/* ---------- footer ---------- */
footer.site{background:var(--ink);color:#cfc7b6;padding:54px 0 36px;}
footer.site .ftop{display:flex;justify-content:space-between;flex-wrap:wrap;gap:2rem;}
footer.site .he{font-family:var(--serif-zh);font-size:2rem;color:var(--gold);}
footer.site h1{font-family:var(--serif);font-size:1.3rem;color:#fff;margin:.2rem 0 .4rem;font-weight:500;}
footer.site a{color:#d8cfbb;}footer.site a:hover{color:var(--gold);}
footer.site .fnav{display:flex;gap:1.4rem;flex-wrap:wrap;font-family:var(--serif);}
footer.site .fine{margin-top:2.4rem;padding-top:1.4rem;border-top:1px solid #3a352d;font-size:.82rem;color:#8d8676;}
/* funding + credits */
footer.site .fund{max-width:760px;font-size:.92rem;line-height:1.6;color:#cfc7b6;}
footer.site .fund .zh{display:block;margin-top:.4rem;color:#a99e86;}
footer.site .credits{margin-top:2.2rem;}
footer.site .credits h4{font-family:var(--serif);font-size:1.15rem;color:#fff;font-weight:500;margin:0 0 .2rem;}
footer.site .credits h4 .zh{display:block;font-size:.82em;color:#a99e86;}
footer.site .credits .rule{width:46px;height:2px;background:var(--gold);margin:.7rem 0 1.1rem;}
footer.site .credits dl{display:grid;grid-template-columns:auto 1fr;gap:.32rem 1.1rem;margin:0;font-size:.9rem;max-width:760px;}
footer.site .credits dt{color:#a99e86;white-space:nowrap;}
footer.site .credits dd{margin:0;color:#e3dccb;}
@media(max-width:600px){footer.site .credits dl{grid-template-columns:1fr;gap:.05rem;}footer.site .credits dd{margin-bottom:.5rem;}}

/* ---------- responsive ---------- */
@media(max-width:860px){
  .navlinks{position:fixed;top:68px;right:0;left:0;background:var(--cream);flex-direction:column;align-items:flex-start;
    padding:1rem 24px;border-bottom:1px solid var(--line);display:none;gap:1rem;}
  .navlinks.open{display:flex;}
  .menubtn{display:block;}
  .fourgrid,.speakers,.committee{grid-template-columns:1fr;}
  .masonry{columns:2;}
  .prow{flex-direction:column;gap:.2rem;}
  .prow .time{flex:none;}
}
@media(max-width:520px){
  .spk{flex-direction:column;align-items:flex-start;}
  .masonry{columns:1;}
}