/* ════════════════════════════════════════════════
   THE ART OF A WELL-PLANNED LIFE
   Maggie Ju — Personal Brand Website
   ════════════════════════════════════════════════ */

/* ── RESET ── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{
  font-family:'Inter','Noto Sans SC',sans-serif;
  background:#F3F0E8;
  color:#11110F;
  overflow-x:hidden;
  line-height:1.7;
}

/* ── COLORS ── */
:root{
  --ivory:#F3F0E8;
  --ink:#11110F;
  --forest:#1D3028;
  --stone:#B8B0A4;
  --bronze:#A98658;
  --bronze-light:#C4A47A;
  --ivory-dark:#E8E3D7;
  --white-warm:#F8F6F1;
  /* ── DESIGN TOKENS (Unified) ── */
  --radius-sm:2px;
  --radius-md:4px;
  --radius-lg:8px;
  --shadow-soft:0 4px 20px rgba(17,17,15,.06);
  --shadow-hover:0 8px 30px rgba(17,17,15,.10);
  --transition-fast:.2s cubic-bezier(.22,1,.36,1);
  --transition-base:.3s cubic-bezier(.22,1,.36,1);
  --transition-slow:.6s cubic-bezier(.22,1,.36,1);
  --section-gap:6rem;
  /* Low-saturation accent palette */
  --tint-mist:rgba(220,229,232,.35);
  --tint-sand:rgba(232,221,201,.35);
  --tint-sage:rgba(220,227,214,.35);
  --tint-mauve:rgba(221,215,216,.35);
}

/* ── TYPOGRAPHY ── */
.serif{font-family:'Cormorant Garamond','Noto Serif SC',serif}
.serif-display{font-family:'DM Serif Display','Noto Serif SC',serif}
.zh-serif{font-family:'Noto Serif SC',serif}
.zh-sans{font-family:'Noto Sans SC',sans-serif}

/* ── SCROLLBAR ── */
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--ivory)}
::-webkit-scrollbar-thumb{background:var(--stone);border-radius:0}

/* ── IMAGE PROTECTION: view only, no download ── */
img{
  -webkit-user-drag:none;
  -moz-user-select:none;
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  pointer-events:auto;
}

/* ══ NAVIGATION ══ */
nav{
  position:fixed;top:0;left:0;width:100%;z-index:1000;
  padding:1.5rem 3rem;
  display:flex;justify-content:space-between;align-items:center;
  transition:all .6s cubic-bezier(.22,1,.36,1);
  background:transparent;
}
nav.scrolled{
  background:rgba(243,240,232,.95);
  backdrop-filter:blur(20px);
  padding:1rem 3rem;
  border-bottom:1px solid rgba(184,176,164,.3);
}
nav.scrolled .nav-logo,nav.scrolled .nav-links a,nav.scrolled .lang-toggle{
  color:var(--ink);
}
nav.scrolled .nav-links a:hover{color:var(--bronze)}

.nav-logo{
  font-family:'DM Serif Display',serif;
  font-size:1.5rem;
  color:#fff;
  text-decoration:none;
  letter-spacing:.5px;
  transition:color .6s;
}
.nav-links{display:flex;gap:2.5rem;align-items:center}
.nav-links a{
  color:rgba(255,255,255,.8);
  text-decoration:none;
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:2px;
  font-weight:400;
  transition:color .3s;
}
.nav-links a:hover{color:#fff}
.lang-toggle{
  display:flex;gap:.75rem;align-items:center;
  font-size:.7rem;color:rgba(255,255,255,.7);
  letter-spacing:2px;cursor:pointer;
  transition:color .6s;
}
.lang-toggle .active{color:var(--bronze-light);font-weight:600}
.lang-toggle span{cursor:pointer;transition:all .3s}
.lang-toggle span:hover{color:var(--bronze)}

/* ══ HERO ══ */
#hero{
  height:100vh;min-height:700px;position:relative;
  display:flex;align-items:center;
  overflow:hidden;
}
.hero-bg{
  position:absolute;inset:0;
  background:linear-gradient(135deg,#1a1a18 0%,#2a2a26 100%);
}
.hero-bg img{
  width:100%;height:100%;object-fit:cover;
  opacity:.6;
}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to right,rgba(17,17,15,.7) 0%,rgba(17,17,15,.3) 50%,transparent 100%);
}
.hero-content{
  position:relative;z-index:2;
  max-width:1400px;margin:0 auto;
  width:100%;padding:0 3rem;
}
.hero-text{max-width:600px}
.hero-name{
  font-family:'DM Serif Display',serif;
  font-size:clamp(3rem,7vw,5.5rem);
  color:#fff;line-height:1;margin-bottom:.5rem;
  letter-spacing:-1px;
}
.hero-tagline{
  font-family:'Cormorant Garamond',serif;
  font-size:1.1rem;color:var(--bronze-light);
  letter-spacing:4px;text-transform:uppercase;
  margin-bottom:.75rem;font-style:italic;
}
.hero-role{
  font-size:.75rem;color:rgba(255,255,255,.5);
  letter-spacing:3px;text-transform:uppercase;
  margin-bottom:2.5rem;
}
.hero-title-zh{
  font-family:'Noto Serif SC',serif;
  font-size:clamp(1.3rem,2.5vw,1.8rem);
  color:#fff;font-weight:300;
  line-height:1.6;margin-bottom:.5rem;
}
.hero-title-en{
  font-family:'Cormorant Garamond',serif;
  font-style:italic;font-size:1.2rem;
  color:rgba(255,255,255,.5);font-weight:300;
  margin-bottom:3rem;
}
.hero-buttons{display:flex;gap:1rem;flex-wrap:wrap}
.btn{
  padding:.85rem 2rem;
  font-size:.7rem;letter-spacing:2px;text-transform:uppercase;
  text-decoration:none;border:1px solid;
  transition:all .4s cubic-bezier(.22,1,.36,1);
  display:inline-block;
}
.btn-primary{
  background:var(--bronze);color:#fff;border-color:var(--bronze);
}
.btn-primary:hover{
  background:transparent;color:var(--bronze-light);
}
.btn-ghost{
  background:transparent;color:#fff;border-color:rgba(255,255,255,.3);
}
.btn-ghost:hover{
  border-color:#fff;background:rgba(255,255,255,.05);
}

/* ══ SECTION COMMON ══ */
section{position:relative}
.section-label{
  font-family:'Cormorant Garamond',serif;
  font-size:.75rem;color:var(--bronze);
  letter-spacing:4px;text-transform:uppercase;
  margin-bottom:1rem;font-style:italic;
}
.section-number{
  font-family:'DM Serif Display',serif;
  font-size:clamp(4rem,8vw,6rem);
  color:var(--stone);opacity:.4;
  line-height:1;margin-bottom:-.5rem;
}
.section-padding{padding:8rem 3rem}
.container{max-width:1400px;margin:0 auto}
.container-narrow{max-width:900px;margin:0 auto}

/* ══ MANIFESTO ══ */
#manifesto{background:var(--ivory);text-align:center}
.manifesto-text{
  font-family:'Noto Serif SC',serif;
  font-size:clamp(2rem,4.5vw,3.5rem);
  font-weight:300;line-height:1.5;
  color:var(--ink);margin-bottom:3rem;
}
.manifesto-text .bronze-word{color:var(--bronze)}
.manifesto-en{
  font-family:'Cormorant Garamond',serif;
  font-style:italic;font-size:1.15rem;
  color:var(--stone);line-height:2;
  max-width:650px;margin:0 auto;font-weight:300;
}
.manifesto-divider{
  width:1px;height:60px;background:var(--stone);
  margin:3rem auto;
}

/* ══ JOURNEY ══ */
#journey{background:var(--white-warm)}
.journey-header{margin-bottom:5rem}
.journey-title-en{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.5rem,5vw,4rem);
  font-weight:400;color:var(--ink);
  line-height:1.2;margin-bottom:1rem;
}
.journey-title-zh{
  font-family:'Noto Serif SC',serif;
  font-size:1.1rem;color:var(--stone);
  font-weight:400;
}
.timeline{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
}
.timeline-item{
  padding:3rem 2rem;
  border-left:1px solid var(--stone);
  position:relative;
}
.timeline-item:nth-child(even){
  border-left:none;
  border-right:1px solid var(--stone);
  text-align:right;
  padding-right:2rem;
}
.timeline-year{
  font-family:'DM Serif Display',serif;
  font-size:3rem;color:var(--bronze);
  line-height:1;
}
.timeline-place{
  font-family:'Cormorant Garamond',serif;
  font-size:1.5rem;color:var(--ink);
  letter-spacing:3px;text-transform:uppercase;
  margin:.5rem 0;
}
.timeline-text{
  font-family:'Noto Sans SC',sans-serif;
  font-size:.95rem;color:#666;line-height:1.8;
}
.timeline-item:nth-child(even) .timeline-text{text-align:right}

/* ── JOURNEY ROLES ── */
.roles-bar{
  display:flex;justify-content:center;gap:3rem;
  padding:3rem 0;flex-wrap:wrap;
  border-top:1px solid rgba(184,176,164,.3);
  border-bottom:1px solid rgba(184,176,164,.3);
  margin-top:4rem;
}
.role-tag{
  font-family:'Cormorant Garamond',serif;
  font-size:.85rem;letter-spacing:3px;
  text-transform:uppercase;color:var(--stone);
  font-style:italic;
}

/* ══ ADVISORY ══ */
#advisory{background:var(--ivory)}
.advisory-header{text-align:center;margin-bottom:5rem}
.advisory-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:0;
  border-top:1px solid var(--stone);
}
.advisory-item{
  padding:4rem 3rem;
  border-bottom:1px solid var(--stone);
  position:relative;
  transition:background .6s;
  cursor:default;
}
.advisory-item:nth-child(odd){border-right:1px solid var(--stone)}
.advisory-item:hover{background:var(--white-warm)}
.advisory-num{
  font-family:'DM Serif Display',serif;
  font-size:1.5rem;color:var(--bronze);
  margin-bottom:1rem;
}
.advisory-title-en{
  font-family:'Cormorant Garamond',serif;
  font-size:2rem;color:var(--ink);
  font-weight:400;margin-bottom:.5rem;
}
.advisory-title-zh{
  font-family:'Noto Serif SC',serif;
  font-size:1.3rem;color:var(--ink);
  font-weight:300;margin-bottom:1.5rem;
}
.advisory-desc{
  font-size:.9rem;color:#777;line-height:1.9;
  max-width:400px;
  max-height:0;overflow:hidden;
  transition:max-height .6s cubic-bezier(.22,1,.36,1);
}
.advisory-item:hover .advisory-desc{max-height:200px}

/* ══ CREDENTIALS ══ */
#credentials{
  background:var(--ink);color:#fff;
}
#credentials .section-number{color:#333}
.cred-header{text-align:center;margin-bottom:5rem}
.cred-title-en{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2rem,4vw,3rem);
  font-weight:400;color:#fff;
  margin-bottom:.75rem;
}
.cred-title-zh{
  font-family:'Noto Serif SC',serif;
  font-size:1rem;color:var(--stone);
}
.cred-list{
  max-width:700px;margin:0 auto;
}
.cred-item{
  display:flex;justify-content:space-between;align-items:center;
  padding:2rem 0;
  border-bottom:1px solid rgba(184,176,164,.15);
}
.cred-item:last-child{border-bottom:none}
.cred-name{
  font-family:'Cormorant Garamond',serif;
  font-size:1.3rem;color:#fff;font-weight:400;
}
.cred-detail{
  font-size:.8rem;color:var(--stone);
  letter-spacing:1px;
}
.cred-item{cursor:pointer;position:relative}
.cred-item .cred-detail-inline{
  font-size:.7rem;color:var(--stone);
  font-weight:300;letter-spacing:1px;
}
.cred-item:hover .cred-name{color:var(--bronze-light)}

/* ── Certificate Preview Tooltip ── */
.cert-preview{
  position:fixed;z-index:3000;
  width:340px;max-width:80vw;
  background:#fff;
  box-shadow:0 30px 80px rgba(0,0,0,.35),0 10px 25px rgba(0,0,0,.15);
  opacity:0;visibility:hidden;
  transform:translateY(8px) scale(.97);
  transition:all .35s cubic-bezier(.22,1,.36,1);
  pointer-events:none;
}
.cert-preview.visible{
  opacity:1;visibility:visible;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}
.cert-preview img{
  width:100%;height:auto;display:block;
}
.cert-slider{
  width:100%;overflow:hidden;
}
.cert-slider img{
  width:100%;height:auto;display:block;
  transition:opacity .3s ease;
}
.cert-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(17,17,15,.55);color:#fff;
  border:none;width:34px;height:34px;
  font-size:1.4rem;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .3s;
  z-index:2;line-height:1;
}
.cert-arrow:hover{background:var(--bronze)}
.cert-prev{left:8px}
.cert-next{right:8px}
.cert-dots{
  position:absolute;bottom:10px;left:0;right:0;
  display:flex;justify-content:center;gap:6px;
  z-index:2;
}
.cert-dots span{
  width:6px;height:6px;border-radius:50%;
  background:rgba(255,255,255,.5);
  cursor:pointer;transition:all .3s;
}
.cert-dots span.active{background:var(--bronze-light);transform:scale(1.3)}
@media(max-width:768px){
  .cert-preview{
    width:280px;
  }
}

/* ══ TESTIMONIALS ══ */
#testimonials{background:var(--white-warm);text-align:center}
.testimonial-wrapper{
  max-width:800px;margin:0 auto;position:relative;
}
.testimonial-quote-mark{
  font-family:'DM Serif Display',serif;
  font-size:8rem;color:var(--stone);opacity:.3;
  line-height:1;margin-bottom:-2rem;
}
.testimonial-text{
  font-family:'Noto Serif SC',serif;
  font-size:clamp(1.3rem,2.5vw,1.8rem);
  font-weight:300;color:var(--ink);
  line-height:1.8;margin-bottom:2rem;
}
.testimonial-author{
  font-family:'Cormorant Garamond',serif;
  font-size:1rem;color:var(--bronze);
  letter-spacing:2px;
}
.testimonial-nav{
  display:flex;justify-content:center;gap:.75rem;margin-top:3rem;
}
.testimonial-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--stone);opacity:.4;
  cursor:pointer;transition:all .3s;
}
.testimonial-dot.active{opacity:1;background:var(--bronze)}
.testimonial-slide{display:none}
.testimonial-slide.active{display:block}

/* ══ COMMUNITY ══ */
#community{background:var(--ivory)}

/* ══ PHOTO GALLERY ══ */
.gallery-stage{
  position:relative;width:100%;
  display:flex;justify-content:center;align-items:center;
  min-height:500px;perspective:1000px;
}
/* All photo stacks are now flat horizontal sliders */
.photo-stack{
  position:relative;
  display:flex;
  gap:2rem;
  width:100%;max-width:1100px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  padding:1.5rem 0;
  cursor:default;
  -webkit-overflow-scrolling:touch;
}
.photo-stack::-webkit-scrollbar{height:4px}
.photo-stack::-webkit-scrollbar-thumb{background:var(--stone);border-radius:0}
.stack-photo{
  position:relative !important;
  flex:0 0 300px;
  width:300px !important;
  height:380px !important;
  top:auto !important;left:auto !important;
  right:auto !important;margin-left:0 !important;
  transform:none !important;
  overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,.15),0 6px 15px rgba(0,0,0,.08);
  background:var(--ivory-dark);
  transition:box-shadow .6s ease;
  opacity:1 !important;pointer-events:auto !important;
}
.stack-photo:nth-child(2){
  width:300px !important;height:380px !important;
  margin-left:0 !important;
}
.stack-photo.extra{
  opacity:1;pointer-events:auto;
  transform:none;
}
.stack-photo img{
  width:100%;height:100%;object-fit:cover;
  transition:transform 1.2s cubic-bezier(.22,1,.36,1);
}
.stack-photo:hover img{transform:scale(1.04)}
.stack-photo:hover{box-shadow:0 30px 80px rgba(0,0,0,.2),0 10px 25px rgba(0,0,0,.1)}

/* ── Single-photo mode (Journal): show one photo at a time, arrows switch ── */
.photo-stack.single{
  width:280px;max-width:100%;
  overflow-x:hidden;
  margin:0 auto;
}
.photo-stack.single .stack-photo{
  flex:0 0 280px;
  width:280px !important;height:350px !important;
}
.photo-stack.single .stack-photo:nth-child(2){
  width:280px !important;height:350px !important;
}

/* ── Gallery arrows ── */
.gallery-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(17,17,15,.45);color:#fff;
  border:none;width:44px;height:44px;
  font-size:1.6rem;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .3s;z-index:10;
}
.gallery-arrow:hover{background:var(--bronze)}
.gallery-prev{left:0}
.gallery-next{right:0}

@media(max-width:768px){
  .photo-stack{gap:1rem}
  .stack-photo{
    flex:0 0 220px;
    width:220px !important;height:290px !important;
  }
  .stack-photo:nth-child(2){
    width:220px !important;height:290px !important;
  }
  .photo-stack.single{
    width:220px;
  }
  .photo-stack.single .stack-photo{
    flex:0 0 220px;
    width:220px !important;height:290px !important;
  }
  .photo-stack.single .stack-photo:nth-child(2){
    width:220px !important;height:290px !important;
  }
  .gallery-arrow{
    width:36px;height:36px;
    font-size:1.3rem;
  }
}

/* ── Fullscreen lightbox ── */
.lightbox{
  position:fixed;inset:0;z-index:2000;
  background:rgba(17,17,15,.92);
  display:none;align-items:center;justify-content:center;
  opacity:0;transition:opacity .6s ease;
}
.lightbox.open{display:flex;opacity:1}
.lightbox img{
  max-width:85vw;max-height:85vh;object-fit:contain;
  box-shadow:0 30px 100px rgba(0,0,0,.5);
  transform:scale(.9);transition:transform .6s cubic-bezier(.22,1,.36,1);
}
.lightbox.open img{transform:scale(1)}
.lightbox-arrow{
  position:fixed;top:50%;transform:translateY(-50%);
  background:rgba(255,255,255,.08);color:#fff;
  border:1px solid rgba(255,255,255,.15);
  width:52px;height:52px;
  font-size:2rem;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .3s;z-index:2001;
  border-radius:50%;
}
.lightbox-arrow:hover{background:var(--bronze);border-color:var(--bronze)}
.lightbox-prev{left:1.5rem}
.lightbox-next{right:1.5rem}
.lightbox-counter{
  position:fixed;bottom:2rem;left:50%;transform:translateX(-50%);
  color:rgba(255,255,255,.7);
  font-size:.8rem;letter-spacing:2px;
  font-family:'Cormorant Garamond',serif;
  z-index:2001;
}
@media(max-width:768px){
  .lightbox-arrow{width:42px;height:42px;font-size:1.5rem}
  .lightbox-prev{left:.75rem}
  .lightbox-next{right:.75rem}
}
.lightbox-close{
  position:fixed;top:2rem;right:2.5rem;
  font-size:2rem;color:rgba(255,255,255,.6);
  cursor:pointer;background:none;border:none;
  transition:color .3s;font-family:sans-serif;
}
.lightbox-close:hover{color:#fff}

@media(max-width:768px){
  .photo-stack{width:280px;height:360px;transform:scale(.85)}
  .stack-photo{width:220px;height:290px}
  .stack-photo:nth-child(2){margin-left:-110px}
  .photo-stack.expanded .stack-photo:nth-child(1){
    top:-200px;left:50%;margin-left:-110px;
    transform:rotate(-3deg) scale(.9);
  }
  .photo-stack.expanded .stack-photo:nth-child(2){
    top:0;left:50%;margin-left:-110px;
    width:220px;height:290px;
    transform:rotate(0deg) scale(1);
  }
  .photo-stack.expanded .stack-photo:nth-child(3){
    top:200px;right:auto;left:50%;margin-left:-110px;
    transform:rotate(3deg) scale(.9);
  }
}
.community-header{margin-bottom:5rem}
.comm-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:4rem;align-items:center;
}
.comm-values{
  display:flex;flex-direction:column;gap:2rem;
}
.comm-value{
  border-left:2px solid var(--bronze);
  padding-left:1.5rem;
}
.comm-value-en{
  font-family:'Cormorant Garamond',serif;
  font-size:1.3rem;color:var(--ink);
  font-style:italic;
}
.comm-value-zh{
  font-family:'Noto Sans SC',sans-serif;
  font-size:.85rem;color:#666;margin-top:.25rem;
}
.comm-orgs{
  margin-top:3rem;display:flex;flex-direction:column;gap:1rem;
}
.comm-org{
  font-family:'Cormorant Garamond',serif;
  font-size:1rem;color:var(--stone);
  letter-spacing:1px;
}
.comm-org span{color:var(--ink);font-weight:500}

/* ══ JOURNAL ══ */
#journal{background:var(--white-warm)}
.journal-header{margin-bottom:5rem}
.journal-categories{
  display:flex;gap:2rem;margin-top:1.5rem;flex-wrap:wrap;
}
.journal-cat{
  font-family:'Cormorant Garamond',serif;
  font-size:.8rem;letter-spacing:3px;
  text-transform:uppercase;color:var(--stone);
  cursor:pointer;transition:color .3s;font-style:italic;
}
.journal-cat:hover,.journal-cat.active{color:var(--bronze)}
.journal-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:2.5rem;
}
/* Editorial staggered layout: 3 + 2 + 2 */
.journal-grid .journal-card:nth-child(-n+3){
  grid-column:span 2;
}
.journal-grid .journal-card:nth-child(n+4){
  grid-column:span 3;
}
.journal-card{cursor:pointer;transition:transform .6s}
.journal-card:hover{transform:translateY(-4px)}
.journal-card-img{
  width:100%;aspect-ratio:4/3;
  background:var(--stone);margin-bottom:1.5rem;
  overflow:hidden;
}
.journal-card-img img{
  width:100%;height:100%;object-fit:cover;
  transition:transform 1.2s cubic-bezier(.22,1,.36,1);
}
.journal-card:hover .journal-card-img img{transform:scale(1.03)}
.journal-card-cat{
  font-family:'Cormorant Garamond',serif;
  font-size:.7rem;color:var(--bronze);
  letter-spacing:3px;text-transform:uppercase;
  margin-bottom:.5rem;font-style:italic;
}
.journal-card-title{
  font-family:'Noto Serif SC',serif;
  font-size:1.1rem;color:var(--ink);
  font-weight:400;line-height:1.5;
}
.journal-card-summary{
  font-size:.85rem;color:#777;margin-top:.5rem;line-height:1.7;
}

/* ══ CONTACT ══ */
#contact{
  background:var(--forest);color:#fff;
  text-align:center;
}
.contact-title-en{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.5rem,5vw,4rem);
  font-weight:400;color:#fff;
  line-height:1.2;margin-bottom:1rem;
}
.contact-title-zh{
  font-family:'Noto Serif SC',serif;
  font-size:clamp(1.2rem,2vw,1.6rem);
  color:var(--bronze-light);font-weight:300;
  margin-bottom:3rem;
}
.contact-buttons{
  display:flex;justify-content:center;gap:1rem;
  margin-bottom:4rem;flex-wrap:wrap;
}
.btn-bronze{
  background:var(--bronze);color:#fff;border-color:var(--bronze);
}
.btn-bronze:hover{background:transparent}
.btn-outline{
  background:transparent;color:#fff;
  border-color:rgba(255,255,255,.25);
}
.btn-outline:hover{border-color:var(--bronze-light)}
.contact-info{
  font-size:.8rem;color:rgba(255,255,255,.4);
  letter-spacing:2px;line-height:2.5;
}
.contact-info a{color:rgba(255,255,255,.5);text-decoration:none;transition:color .3s}
.contact-info a:hover{color:var(--bronze-light)}

/* ══ FOOTER ══ */
footer{
  background:var(--ink);padding:2rem 3rem;
  display:flex;justify-content:space-between;align-items:center;
  font-size:.7rem;color:rgba(255,255,255,.3);
  letter-spacing:1px;
}
footer a{color:rgba(255,255,255,.4);text-decoration:none;margin:0 .5rem}
footer a:hover{color:var(--bronze)}

/* ══ BILINGUAL ══ */
[data-lang="en"] .zh-only{display:none}
[data-lang="zh"] .en-only{display:none}

/* ══ ANIMATIONS ══ */
.reveal{opacity:0;transform:translateY(30px);transition:all 1.2s cubic-bezier(.22,1,.36,1)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.15s}
.reveal-delay-2{transition-delay:.3s}
.reveal-delay-3{transition-delay:.45s}

/* ══ MOBILE ══ */
@media(max-width:768px){
  nav{padding:1rem 1.5rem}
  nav.scrolled{padding:.75rem 1.5rem}
  .nav-links{display:none}
  .nav-links.mobile-open{
    display:flex;position:fixed;top:0;left:0;
    width:100%;height:100vh;background:var(--ink);
    flex-direction:column;justify-content:center;
    align-items:center;gap:2rem;z-index:999;
  }
  .nav-links.mobile-open a{font-size:1.2rem}
  .mobile-menu-btn{display:block;font-size:1.5rem;color:#fff;cursor:pointer;background:none;border:none}
  nav.scrolled .mobile-menu-btn{color:var(--ink)}

  .section-padding{padding:5rem 1.5rem}
  .hero-content{padding:0 1.5rem}

  .timeline{grid-template-columns:1fr}
  .timeline-item:nth-child(even){
    border-right:none;border-left:1px solid var(--stone);
    text-align:left;padding-right:1.5rem;padding-left:2rem;
  }
  .timeline-item:nth-child(even) .timeline-text{text-align:left}

  .advisory-grid{grid-template-columns:1fr}
  .advisory-item:nth-child(odd){border-right:none}
  .advisory-desc{max-height:none}

  .comm-grid{grid-template-columns:1fr;gap:2rem}
  .journal-grid{grid-template-columns:repeat(2,1fr);gap:1rem}
  /* First 5 cards span full width */
  .journal-grid .journal-card:nth-child(-n+5){
    grid-column:span 2;
  }
  /* Cards 6 & 7 (公益 + 坚持运动) side by side */
  .journal-grid .journal-card:nth-child(6),
  .journal-grid .journal-card:nth-child(7){
    grid-column:span 1;
  }
  /* Shrink single-photo stacks for narrow side-by-side cards */
  .photo-stack.single{width:130px}
  .photo-stack.single .stack-photo{
    flex:0 0 130px;
    width:130px !important;height:175px !important;
  }
  .photo-stack.single .stack-photo:nth-child(2){
    width:130px !important;height:175px !important;
  }

  .mobile-menu-btn{display:block!important}
  .roles-bar{gap:1.5rem}
@media(max-width:1100px) and (min-width:769px){
  .journal-grid{grid-template-columns:repeat(6,1fr);gap:1.5rem}
  .journal-grid .journal-card:nth-child(-n+3){
    grid-column:span 2;
  }
  .journal-grid .journal-card:nth-child(n+4){
    grid-column:span 3;
  }
}
}
.mobile-menu-btn{display:none}

/* ── PLACEHOLDER IMAGE STYLES ── */
.placeholder-img{
  background:linear-gradient(135deg,var(--stone) 0%,var(--ivory-dark) 100%);
  display:flex;align-items:center;justify-content:center;
  color:var(--stone);font-family:'Cormorant Garamond',serif;
  font-size:.8rem;letter-spacing:2px;text-transform:uppercase;
}

/* ══ AI CHAT WIDGET ══ */
.ai-chat-widget{
  position:fixed;bottom:1.5rem;right:1.5rem;
  z-index:1500;
  font-family:'Inter','Noto Sans SC',sans-serif;
}
.ai-chat-fab{
  width:58px;height:58px;border-radius:50%;
  background:var(--forest);color:#fff;
  border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  transition:all .4s cubic-bezier(.22,1,.36,1);
  position:relative;
  overflow:hidden;
}
.ai-chat-fab img{
  width:100%;height:100%;object-fit:cover;
  border-radius:50%;
}
.ai-chat-fab:hover{
  transform:scale(1.05);
  background:var(--bronze);
}
.ai-chat-fab:hover img{opacity:.85}
.ai-fab-close{display:none}
.ai-chat-widget.open .ai-fab-icon{display:none}
.ai-chat-widget.open .ai-fab-close{display:block;font-size:1.2rem}

.ai-chat-window{
  position:absolute;bottom:4.5rem;right:0;
  width:370px;max-width:calc(100vw - 2rem);
  height:540px;max-height:calc(100vh - 7rem);
  background:var(--white-warm);
  border-radius:16px;
  box-shadow:0 30px 80px rgba(0,0,0,.25);
  display:flex;flex-direction:column;
  overflow:hidden;
  opacity:0;visibility:hidden;
  transform:translateY(16px) scale(.97);
  transform-origin:bottom right;
  transition:all .45s cubic-bezier(.22,1,.36,1);
}
.ai-chat-widget.open .ai-chat-window{
  opacity:1;visibility:visible;
  transform:translateY(0) scale(1);
}

.ai-chat-header{
  background:var(--forest);color:#fff;
  padding:1rem 1.25rem;
  display:flex;justify-content:space-between;align-items:center;
}
.ai-chat-header-info{display:flex;align-items:center;gap:.75rem}
.ai-chat-avatar{
  width:38px;height:38px;border-radius:50%;
  background:var(--bronze);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-family:'DM Serif Display',serif;font-size:1.1rem;
  overflow:hidden;
  flex-shrink:0;
}
.ai-chat-avatar img{
  width:100%;height:100%;object-fit:cover;
  border-radius:50%;
}
.ai-chat-title{
  font-family:'DM Serif Display',serif;
  font-size:1rem;letter-spacing:.5px;
}
.ai-chat-subtitle{
  font-size:.7rem;color:rgba(255,255,255,.6);
  margin-top:2px;
}
.ai-chat-minimize{
  background:none;border:none;color:rgba(255,255,255,.7);
  font-size:1.1rem;cursor:pointer;padding:.25rem .5rem;
  transition:color .3s;
}
.ai-chat-minimize:hover{color:#fff}

.ai-chat-messages{
  flex:1;overflow-y:auto;
  padding:1.25rem;
  display:flex;flex-direction:column;gap:1rem;
  background:var(--white-warm);
}
.ai-chat-messages::-webkit-scrollbar{width:4px}
.ai-chat-messages::-webkit-scrollbar-thumb{background:var(--stone);border-radius:0}

.ai-msg{display:flex;gap:.6rem;max-width:88%}
.ai-msg-bot{align-self:flex-start}
.ai-msg-user{align-self:flex-end;flex-direction:row-reverse}
.ai-msg-avatar{
  width:28px;height:28px;border-radius:50%;
  background:var(--bronze);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-family:'DM Serif Display',serif;font-size:.8rem;
  flex-shrink:0;
  overflow:hidden;
}
.ai-msg-avatar img{
  width:100%;height:100%;object-fit:cover;
  border-radius:50%;
}
.ai-msg-bot .ai-msg-avatar{background:var(--bronze)}
.ai-msg-user .ai-msg-avatar{background:var(--stone)}
.ai-msg-bubble{
  padding:.75rem 1rem;
  border-radius:14px;
  font-size:.85rem;line-height:1.7;
  word-break:break-word;
}
.ai-msg-bot .ai-msg-bubble{
  background:#fff;color:var(--ink);
  border:1px solid rgba(184,176,164,.3);
  border-top-left-radius:4px;
}
.ai-msg-user .ai-msg-bubble{
  background:var(--forest);color:#fff;
  border-top-right-radius:4px;
}
.ai-msg-typing .ai-msg-bubble{
  display:flex;gap:4px;align-items:center;
  padding:1rem 1.1rem;
}
.ai-msg-typing .dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--stone);
  animation:aiBlink 1.2s infinite;
}
.ai-msg-typing .dot:nth-child(2){animation-delay:.2s}
.ai-msg-typing .dot:nth-child(3){animation-delay:.4s}
@keyframes aiBlink{
  0%,80%,100%{opacity:.3}
  40%{opacity:1}
}

.ai-chat-input-area{
  padding:1rem 1.25rem 1rem;
  border-top:1px solid rgba(184,176,164,.25);
  background:var(--white-warm);
}
.ai-quick-questions{
  display:flex;gap:.5rem;flex-wrap:wrap;
  margin-bottom:.75rem;
}
.ai-quick-chip{
  font-size:.72rem;padding:.35rem .8rem;
  border:1px solid rgba(169,134,88,.4);
  border-radius:50px;
  color:var(--bronze);
  cursor:pointer;
  transition:all .3s;
}
.ai-quick-chip:hover{
  background:var(--bronze);color:#fff;
}
.ai-chat-input-row{
  display:flex;gap:.5rem;
}
.ai-chat-input{
  flex:1;
  padding:.7rem 1rem;
  border:1px solid rgba(184,176,164,.4);
  border-radius:50px;
  font-size:.85rem;
  font-family:inherit;
  background:#fff;color:var(--ink);
  outline:none;
  transition:border-color .3s;
}
.ai-chat-input:focus{border-color:var(--bronze)}
.ai-chat-send{
  width:42px;height:42px;border-radius:50%;
  background:var(--bronze);color:#fff;
  border:none;cursor:pointer;
  font-size:1rem;
  transition:all .3s;
  flex-shrink:0;
}
.ai-chat-send:hover{background:var(--forest)}
.ai-chat-disclaimer{
  font-size:.62rem;color:var(--stone);
  text-align:center;margin-top:.6rem;
  line-height:1.5;
}

@media(max-width:768px){
  .ai-chat-widget{bottom:1rem;right:1rem}
  .ai-chat-fab{width:52px;height:52px;font-size:1.3rem}
  .ai-chat-window{
    width:calc(100vw - 2rem);
    height:calc(100vh - 8rem);
    bottom:4rem;
  }
}

/* ══ BOOKING FORM MODAL ══ */
.booking-modal{
  position:fixed;inset:0;z-index:2000;
  display:none;align-items:center;justify-content:center;
  font-family:'Inter','Noto Sans SC',sans-serif;
}
.booking-modal.open{display:flex}
.booking-overlay{
  position:absolute;inset:0;
  background:rgba(17,17,15,.65);
  backdrop-filter:blur(4px);
}
.booking-form{
  position:relative;z-index:2;
  background:var(--white-warm);
  width:480px;max-width:calc(100vw - 2rem);
  max-height:90vh;overflow-y:auto;
  padding:2.5rem;
  border-radius:4px;
  box-shadow:0 40px 100px rgba(0,0,0,.4);
  animation:bookingIn .5s cubic-bezier(.22,1,.36,1);
}
@keyframes bookingIn{
  from{opacity:0;transform:translateY(24px) scale(.97)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.booking-close{
  position:absolute;top:1rem;right:1.25rem;
  background:none;border:none;
  font-size:1.3rem;color:var(--stone);
  cursor:pointer;transition:color .3s;
}
.booking-close:hover{color:var(--ink)}
.booking-form-title{
  font-family:'Noto Serif SC',serif;
  font-size:1.5rem;font-weight:400;
  color:var(--ink);margin-bottom:.5rem;
}
.booking-form-title.en-only{
  font-family:'Cormorant Garamond',serif;
  font-size:1.9rem;
}
.booking-form-sub{
  font-size:.8rem;color:var(--stone);
  line-height:1.7;margin-bottom:1.75rem;
}
.booking-field{
  margin-bottom:1.25rem;
}
.booking-field label{
  display:block;
  font-size:.75rem;letter-spacing:1px;
  color:var(--ink);margin-bottom:.4rem;
  font-weight:500;
}
.booking-field input,
.booking-field select,
.booking-field textarea{
  width:100%;
  padding:.7rem .9rem;
  border:1px solid rgba(184,176,164,.45);
  border-radius:2px;
  font-size:.9rem;
  font-family:inherit;
  background:#fff;color:var(--ink);
  outline:none;
  transition:border-color .3s;
}
.booking-field input:focus,
.booking-field select:focus,
.booking-field textarea:focus{
  border-color:var(--bronze);
}
.booking-field textarea{resize:vertical}
.booking-submit{
  width:100%;
  padding:.9rem;
  background:var(--bronze);color:#fff;
  border:none;cursor:pointer;
  font-size:.85rem;letter-spacing:2px;
  text-transform:uppercase;
  font-family:inherit;
  transition:background .3s;
  margin-top:.5rem;
}
.booking-submit:hover{background:var(--forest)}
.booking-status{
  margin-top:1rem;
  font-size:.85rem;text-align:center;
  line-height:1.6;min-height:1.5em;
}
.booking-status.success{color:var(--forest)}
.booking-status.error{color:#a33}