
:root{
  --ink:#08100f;
  --ink-2:#121512;
  --ink-3:#1a1e1a;
  --paper:#edf0ec;
  --paper-2:#e8e1d4;
  --text:#ece7dd;
  --text-ink:#111b18;
  --muted:#a7aca3;
  --muted-ink:#5b665f;
  --sand:#a3b8ae;
  --sea:#c7a97e;
  --sea-deep:#3b3630;
  --coral:#c7a97e;
  --line:rgba(236,231,221,.15);
  --line-ink:rgba(17,27,24,.16);
  --display:"Fraunces","Songti TC","Noto Serif TC",Georgia,serif;
}

body.layout-split .hero-inner{width:min(58%,820px);margin-left:5vw}
body.layout-split .hero-art{left:38%}
body.layout-split .hero h1 .latin{font-size:clamp(2.2rem,5.6vw,5rem)}
body.layout-split .hero-line{font-size:clamp(1.05rem,1.9vw,1.6rem);max-width:20em}
body.layout-split .side-rail{display:none}

body.name-long .hero h1 .latin{font-size:clamp(1.9rem,5.2vw,4.7rem)}
body.name-xlong .hero h1 .latin{font-size:clamp(1.65rem,4.4vw,3.9rem);letter-spacing:-.01em}
body.name-long .brand-en{font-size:.72rem}
body.name-xlong .brand-en{font-size:.64rem}
@media(max-width:760px){
  body.name-long .hero h1 .latin,body.name-xlong .hero h1 .latin{font-size:clamp(1.55rem,8vw,2.7rem)}
  .hero-inner{width:100%;padding-left:20px;padding-right:20px}
}

/* ---------- nocturne signature ---------- */
body{--focus:#a3b8ae}
.brand{display:inline-flex;align-items:center;gap:12px}
.brand-mark{flex:0 0 auto;opacity:.9}
.section-head h2,.split-lede h2{text-wrap:balance}
.section-head,.personalize .section-head,.contact-head{margin-left:auto;margin-right:auto}
.section-head,.contact-head{width:min(1200px,100%);max-width:none}
.personalize .section-head{width:min(1100px,100%);max-width:none}
.section-head h2{max-width:15em}
.section-head .section-lead{max-width:44em}
body{color-scheme:dark}
.hero h1 .latin{letter-spacing:-.015em}
.hero-photo{opacity:.8;mix-blend-mode:normal;filter:saturate(1.08) contrast(1.03) brightness(.9)}
.hero-art img{position:absolute;inset:0;z-index:0}
.hero-art svg{position:absolute;inset:0;z-index:1;opacity:1}
.ghost-mark{position:absolute;right:-2%;bottom:4%;z-index:1;width:min(36vw,480px);height:min(36vw,480px);opacity:.13;display:none;overflow:visible}
.ghost-mark *{vector-effect:non-scaling-stroke;stroke-width:1}
body:not(.has-photo) .ghost-mark{display:block}
body:not(.has-photo) .hero-art svg{opacity:1;filter:contrast(1.08)}
body.has-photo .hero-art svg{opacity:.78}
body.has-photo .hero-art svg > rect:first-of-type{fill:transparent}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(120% 80% at 72% 18%, #a3b8ae2e, transparent 62%);pointer-events:none}
.hero::after{background:linear-gradient(90deg,var(--ink) 0%,rgba(8,10,9,.9) 18%,rgba(8,10,9,.56) 42%,rgba(8,10,9,.1) 70%,rgba(8,10,9,.38) 100%),linear-gradient(180deg,rgba(8,10,9,.36) 0%,rgba(8,10,9,.02) 42%,rgba(8,10,9,.52) 84%,var(--ink) 100%)}
.hero-vertical{position:absolute;right:clamp(14px,2.6vw,44px);top:22vh;z-index:2;margin:0;writing-mode:vertical-rl;text-orientation:mixed;font-family:var(--display);font-size:clamp(1rem,1.5vw,1.45rem);letter-spacing:.42em;color:var(--sand);opacity:.82;text-shadow:0 1px 30px rgba(0,0,0,.5);pointer-events:none}
.hero-vertical::before{content:"";display:block;width:1px;height:64px;margin:0 auto 18px;background:linear-gradient(180deg,transparent,var(--sand))}
.footer-info{width:min(1200px,100%);margin:0 auto 30px;padding-top:18px;border-top:1px solid var(--line);color:var(--text)}
.footer-info summary{cursor:pointer;font-size:.7rem;letter-spacing:.16em;color:var(--muted);list-style:none}
.footer-info summary::-webkit-details-marker{display:none}
.footer-info summary::after{content:" +";color:var(--sand)}
.footer-info[open] summary::after{content:" −"}
.footer-info .info-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:16px}
.footer-info .info-row{border-color:var(--line)}
.footer-info .info-row dt{color:var(--muted)}
.footer-info .info-row dd{color:var(--text)}
.footer-info .source-note{color:var(--muted)}
.contact-assurance{margin:22px 0 0;padding-top:16px;border-top:1px solid var(--line);font-size:.76rem;line-height:1.7;color:var(--muted)}
.location-tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 0;padding:0}
.location-tags li{padding:6px 11px;border:1px solid var(--line-ink);font-size:.7rem;letter-spacing:.1em;color:var(--muted-ink)}
.map-card{background-image:radial-gradient(80% 80% at 70% 20%,#a3b8ae22,transparent 60%),repeating-linear-gradient(0deg,#a3b8ae12 0 1px,transparent 1px 44px),repeating-linear-gradient(90deg,#a3b8ae12 0 1px,transparent 1px 44px)}
.material-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:clamp(34px,4.5vw,58px);border-top:1px solid var(--line)}
.material{display:flex;align-items:center;gap:14px;padding:18px 14px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.material:last-child{border-right:0}
.material i{display:block;width:32px;height:32px;flex:0 0 auto;border:1px solid rgba(255,255,255,.22)}
.material span{font-size:.62rem;letter-spacing:.22em;color:var(--muted)}
@media(max-width:760px){
  .hero-vertical{display:none}
  .material-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .material:nth-child(2){border-right:0}
  .site-header{padding:14px 20px;gap:10px}
  .brand{max-width:64%;gap:8px;flex-wrap:nowrap;overflow:hidden}
  .brand-en{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.14em;font-size:.7rem}
  .brand-zh{display:none}
  .header-actions .text-button{display:none}
  .hero{min-height:92svh}
  body.layout-split .hero-art{left:0}
  body.layout-split .hero-inner{width:100%;margin-left:0}
  .hero::after{background:linear-gradient(180deg,rgba(8,10,9,.5) 0%,rgba(8,10,9,.12) 32%,rgba(8,10,9,.72) 78%,var(--ink) 100%),linear-gradient(90deg,var(--ink) 0%,rgba(8,10,9,.7) 55%,rgba(8,10,9,.25) 100%)}
}
.section{position:relative;isolation:isolate}
.section::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.7}
.quote-band{background:linear-gradient(135deg, #08100f 0%, #413e30 58%, #08100f 100%)}
.quote-band::before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(60% 70% at 76% 24%, #a3b8ae33, transparent 65%)}
.quote-band{min-height:clamp(300px,36vw,500px)}
.quote-band .ghost-mark{display:block;right:5%;bottom:auto;top:50%;transform:translateY(-50%);width:min(26vw,340px);height:auto;opacity:.2;z-index:0}
.button{border-radius:0}
.section-index{font-variant-numeric:tabular-nums;width:auto!important;margin:0!important}

body{background:#070e0d}
.section::after{background:radial-gradient(50% 60% at 80% 20%,#a3b8ae14,transparent 60%),radial-gradient(40% 50% at 10% 80%,#c7a97e12,transparent 60%)}
.hero h1 .latin{font-size:clamp(3.1rem,9.6vw,8.4rem);text-shadow:0 0 60px #a3b8ae33}
.hero .kicker,.hero .eyebrow{color:#b5c6be}
.section-head h2{font-weight:400}
.feature-grid{gap:12px;background:transparent;border:0}
.feature{border:1px solid #a3b8ae26;background:linear-gradient(160deg,#141d1c,#08100f 70%)}
.feature:hover{border-color:#a3b8ae66;background:linear-gradient(160deg,#212b28,#08100f 70%)}
.feature-num{color:#a3b8ae}
.editorial-figure img{filter:saturate(.78) contrast(1.1) brightness(.9)}
.quote-band::before{background:radial-gradient(60% 80% at 30% 20%,#a3b8ae38,transparent 65%)}
.quote-band-text{text-shadow:0 2px 40px #08100f}
.button{box-shadow:0 0 34px #a3b8ae33}
.button:hover{box-shadow:0 0 44px #a3b8ae55}
.press-item:hover{background:#a3b8ae0a}


.signature-block{position:relative;margin-top:clamp(40px,6vw,76px);padding-top:clamp(28px,4vw,44px);border-top:1px solid var(--line-ink)}
.signature-inner{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(26px,5vw,72px);align-items:end;width:min(1200px,100%);margin:0 auto}
.signature-copy{min-width:0}
.signature-kicker{margin:0 0 12px;font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;color:var(--sea-deep)}
.signature-copy h3{margin:0 0 10px;font-family:var(--display);font-size:clamp(1.5rem,3.2vw,2.6rem);font-weight:400;line-height:1.15}
.signature-quote{margin:0 0 22px;font-family:var(--display);font-style:italic;font-size:clamp(1rem,1.8vw,1.35rem);line-height:1.5;color:var(--sea-deep)}
.signature-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px;margin:0}
.sig-fact{display:flex;flex-direction:column;gap:2px}
.sig-num{font-family:var(--display);font-size:clamp(1.6rem,3vw,2.5rem);line-height:1;color:var(--accent,var(--sea-deep))}
.sig-label{font-size:.7rem;letter-spacing:.12em;color:var(--muted-ink)}
.signature-art{min-width:0}
.signature-art svg{width:100%;height:auto;max-height:260px}
@media(max-width:760px){.signature-inner{grid-template-columns:1fr}.signature-art{order:-1}.signature-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}

.signature-block{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:clamp(40px,6vw,80px) clamp(20px,4vw,48px);background:var(--ink);color:var(--text);border-top:1px solid var(--line)}
.signature-block .signature-kicker{color:var(--sea)}
.signature-block .signature-copy h3{color:var(--text)}
.signature-block .signature-quote{color:var(--accent,var(--sand))}
.signature-block .sig-num{color:var(--accent,var(--sand))}
.signature-block .sig-label{color:var(--muted)}
.signature-block .signature-art svg{opacity:.9}
.signature-block .signature-quote{display:none}


body.hero-light{background:var(--paper);color:var(--text-ink)}
body.hero-light .hero{background:var(--paper);min-height:100svh}
body.hero-light .hero-art{position:absolute;left:50%;top:12vh;right:4vw;bottom:12vh;border:1px solid var(--line-ink);overflow:hidden;z-index:0}
body.hero-light .hero-art img{opacity:.92;filter:saturate(.92) contrast(1.02);position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
body.hero-light .hero-art svg{position:absolute;inset:0;width:100%;height:100%;opacity:.9}
body.hero-light .hero-art svg > rect:first-of-type,body.hero-light .hero-art svg > rect:nth-of-type(2){fill:transparent}
body.hero-light .hero::before{display:none}
body.hero-light .hero::after{background:linear-gradient(90deg,var(--paper) 0%,var(--paper) 46%,transparent 60%)}
body.hero-light .hero-inner{width:min(46%,620px);margin-left:5vw;padding-top:20vh;z-index:2}
body.hero-light .hero h1 .latin{color:var(--text-ink);font-size:clamp(2.4rem,6vw,5.4rem)}
body.hero-light .hero h1 .zh{color:var(--accent)}
body.hero-light .hero-line{color:var(--text-ink)}
body.hero-light .hero-meta{color:var(--muted-ink)}
body.hero-light .hero .eyebrow{color:var(--sea-deep)}
body.hero-light .hero-actions .button-ghost{border-color:var(--line-ink);color:var(--text-ink)}
body.hero-light .hero-actions .button-ghost:hover{border-color:var(--accent);color:var(--accent)}
body.hero-light .hero-foot{color:var(--muted-ink)}
body.hero-light .hero-vertical{color:var(--accent);top:auto;bottom:16vh}
body.hero-light .site-header{color:var(--text-ink)}
body.hero-light .site-header .nav a{color:var(--muted-ink)}
body.hero-light .site-header .nav a:hover{color:var(--text-ink)}
body.hero-light .site-header .text-button{color:var(--muted-ink)}
body.hero-light .site-header.is-scrolled{background:rgba(242,237,226,.92);border-color:var(--line-ink)}
body.hero-light .brand-zh{color:var(--accent)}
body.hero-light .menu-toggle span{background:var(--text-ink)}
body.hero-light .hero-art .ghost-mark{opacity:.08}
body.hero-light .hero-line .line > span,body.hero-light .hero h1 .word > span,body.hero-light .hero h1 .line > span{animation:none!important;transform:none!important}
body.hero-light .hero .eyebrow.hero-reveal,body.hero-light .hero .hero-meta.hero-reveal,body.hero-light .hero .hero-actions.hero-reveal{animation:none!important;opacity:1!important;transform:none!important}
body.lang-blueprint .hero-inner{text-align:left}
body.lang-blueprint .hero-actions{justify-content:flex-start}
body.lang-blueprint .hero-line,body.lang-blueprint .hero-meta{margin-left:0;margin-right:0}
body.lang-blueprint .hero h1 .latin{font-size:clamp(2rem,4.6vw,4.2rem)}
.hero-watermark{position:absolute;right:5%;bottom:6%;z-index:1;font-family:var(--display);font-size:clamp(8rem,22vw,20rem);line-height:.8;color:var(--accent,var(--sand));opacity:.09;pointer-events:none;user-select:none}
body.hero-light .hero-watermark{opacity:.06;right:6%;bottom:auto;top:7%}
body.lang-blueprint .hero-watermark{opacity:.06}
.hero-diagram{position:absolute;inset:0;z-index:2;display:grid;place-items:center;pointer-events:none;opacity:.9}
.hero-diagram svg{width:min(78%,520px);height:auto;overflow:visible}
.hero-diagram text{font-family:var(--body);font-size:12px;letter-spacing:.1em;fill:var(--text-ink);opacity:.78}
body:not(.hero-light) .hero-diagram text{fill:var(--muted)}
body.hero-light .hero-diagram{opacity:.95}
body.lang-blueprint .hero-art{border-color:var(--line-ink)}
body.lang-blueprint .hero-art::after{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,var(--line-ink) 1px,transparent 1px),linear-gradient(0deg,var(--line-ink) 1px,transparent 1px);background-size:40px 40px;opacity:.35;pointer-events:none}
body.lang-botanical .hero-art{border-radius:46% 0 0 0 / 18% 0 0 0}
body.lang-gallery .quote-band,body.lang-botanical .quote-band,body.lang-blueprint .quote-band{display:none}
@media(max-width:760px){
  body.hero-light .hero-art{left:0;top:0;right:0;bottom:0;border:0;opacity:.45}
  body.hero-light .hero-art img{opacity:.8}
  body.hero-light .hero::after{background:linear-gradient(180deg,rgba(242,237,226,.98) 0%,rgba(242,237,226,.94) 52%,var(--paper) 100%)}
  body.hero-light .hero-art img{opacity:.55}
  body.hero-light .hero-inner{width:100%;margin-left:0;padding:120px 20px 90px}
  body.hero-light .hero-vertical{display:none}
  .hero-diagram{opacity:.35}
  .hero-diagram text{display:none}
  .hero-watermark{opacity:.04}
}

