@charset "UTF-8";
:root { --paper:#f4f3ec; --ink:#22251f; --muted:#60655a; --line:#d8d9cf; --lime:#d3eb55; --dark:#1b1e19; --font:Arial,"Helvetica Neue","Microsoft YaHei",sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:92px; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--font); font-size:15px; line-height:1.6; -webkit-font-smoothing:antialiased; }
body:has(dialog[open]) { overflow:hidden; }
a { color:inherit; text-decoration:none; }
button { font:inherit; color:inherit; cursor:pointer; }
button,a { -webkit-tap-highlight-color:transparent; }
img { display:block; max-width:100%; height:auto; }
button:focus-visible,a:focus-visible { outline:3px solid #687b17; outline-offset:5px; }
h1,h2,h3,p,figure { margin:0; }
h1,h2,h3 { font-weight:500; line-height:1.12; letter-spacing:-.045em; }
h2 { font-size:clamp(34px,3.6vw,50px); }
em { font-family:Georgia,"Times New Roman",serif; font-weight:400; }
.shell { width:min(1240px,calc(100% - 96px)); margin:auto; }
.section { padding-top:78px; padding-bottom:78px; }
.eyebrow,.section-kicker { font-size:10px; font-weight:600; letter-spacing:.11em; line-height:1.4; }
.section-kicker { display:flex; gap:18px; align-items:center; }
.index { color:var(--muted); font-weight:400; }
.site-header { position:sticky; top:0; z-index:10; background:rgba(244,243,236,.97); border-bottom:1px solid var(--line); backdrop-filter:blur(16px); }
.header-inner { height:82px; display:flex; align-items:center; justify-content:space-between; gap:32px; }
.wordmark { font-size:35px; line-height:1; font-weight:700; letter-spacing:-2px; display:inline-flex; align-items:center; gap:9px; }
.brand-symbol { font-size:36px; line-height:.8; font-weight:400; letter-spacing:0; transform:rotate(10deg); }
.desktop-nav { display:flex; gap:32px; margin-left:auto; margin-right:30px; font-size:12px; }
.desktop-nav a:hover { text-decoration:underline; text-underline-offset:6px; }
.header-actions { display:flex; align-items:center; gap:25px; }
.language-button { border:0; background:none; padding:12px 0; font-size:12px; }
.button { display:inline-flex; align-items:center; gap:36px; background:var(--ink); color:var(--paper); border:1px solid var(--ink); padding:11px 20px; font-size:12px; transition:background .2s,color .2s; }
.button:hover { background:var(--lime); color:var(--ink); }
.menu-toggle { display:none; }
.mobile-nav[hidden] { display:none; }
.mobile-nav { padding:12px 24px; border-top:1px solid var(--line); }
.mobile-nav a { display:block; padding:12px 0; }
.hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:stretch; gap:55px; padding-top:36px; padding-bottom:46px; }
.hero-copy { min-width:0; align-self:center; padding:22px 0; }
.hero .eyebrow { display:flex; align-items:center; gap:12px; }
.tiny-spark { font-size:23px; line-height:1; }
.hero h1 { font-size:clamp(64px,6.4vw,92px); line-height:1.01; letter-spacing:-.06em; margin:33px 0 26px; }
.hero-description { max-width:340px; font-size:15px; color:var(--muted); line-height:1.75; }
.text-link { display:inline-flex; align-items:center; gap:28px; font-size:13px; background:none; border:0; padding:0; }
.hero .text-link { margin-top:28px; }
.circle-arrow { width:32px; height:32px; display:grid; place-items:center; border:1px solid var(--ink); border-radius:50%; font-size:19px; transition:background .2s; }
.text-link:hover .circle-arrow { background:var(--lime); }
.hero-art { position:relative; width:100%; min-width:0; aspect-ratio:1/1.05; background:var(--dark); color:var(--paper); overflow:hidden; }
.orbit-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.art-label,.art-bottom { position:absolute; left:27px; right:27px; display:flex; justify-content:space-between; font-size:8px; letter-spacing:.08em; line-height:1.3; }
.art-label { top:27px; }
.art-bottom { bottom:25px; color:#c3c8b8; }
.art-caption { position:absolute; left:27px; right:27px; bottom:65px; display:flex; align-items:end; justify-content:space-between; font-size:26px; line-height:1.04; letter-spacing:-.035em; white-space:pre-line; }
.art-cross { font-size:55px; font-weight:300; line-height:.8; }
.studio-section { background:#eaece2; }
.section-heading { display:grid; grid-template-columns:1.2fr 1fr; align-items:end; gap:95px; margin-bottom:40px; }
.section-heading h2 { margin-top:24px; white-space:pre-line; }
.section-heading>p { max-width:395px; font-size:14px; color:var(--muted); line-height:1.8; white-space:pre-line; }
.practice-list { border-top:1px solid #c8cdbf; }
.practice-row { display:grid; grid-template-columns:40px 1.05fr 1fr 24px; align-items:center; gap:24px; padding:26px 0; border-bottom:1px solid #c8cdbf; }
.practice-number { font-size:10px; color:var(--muted); }
.practice-row h3 { font-size:26px; letter-spacing:-.035em; }
.practice-row p { font-size:13px; line-height:1.75; color:var(--muted); max-width:390px; }
.practice-mark { font-size:24px; justify-self:end; }
.study-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.study-image { aspect-ratio:1.75; overflow:hidden; }
.study-image img { width:100%; height:100%; object-fit:cover; }
.study-card figcaption { display:flex; align-items:baseline; gap:20px; padding-top:19px; }
.study-number { font-size:10px; color:var(--muted); }
.study-card h3 { font-size:25px; letter-spacing:-.035em; }
.study-card figcaption p { margin-top:6px; font-size:11px; color:var(--muted); }
.concept-note { font-size:11px; color:var(--muted); margin-top:25px; }
.contact-section { background:var(--dark); color:var(--paper); }
.contact-inner { display:grid; grid-template-columns:1.2fr 1fr; align-items:end; gap:95px; }
.contact-section .index { color:#b4bca8; }
.contact-inner h2 { margin-top:25px; font-size:clamp(46px,5.3vw,74px); line-height:1.13; }
.contact-details p { color:#c1c7b8; font-size:14px; max-width:350px; line-height:1.8; margin-bottom:30px; }
.contact-email { display:inline-flex; align-items:center; gap:25px; font-size:clamp(20px,2.2vw,30px); line-height:1.5; letter-spacing:-.03em; border-bottom:1px solid #969e88; padding-bottom:8px; }
.contact-email span { color:var(--lime); }
.contact-email:hover { color:var(--lime); }
.footer-inner { display:flex; align-items:center; gap:30px; padding:25px 0; font-size:10px; color:var(--muted); }
.privacy-button { border:0; background:none; padding:8px; font-size:11px; color:var(--muted); }
.back-top { margin-left:auto; display:flex; gap:20px; align-items:center; font-size:11px; }
.back-top>span:last-child { font-size:18px; }
.privacy-dialog { border:1px solid var(--line); padding:44px; max-width:560px; width:calc(100% - 32px); background:var(--paper); color:var(--ink); max-height:90dvh; overflow:auto; }
.privacy-dialog::backdrop { background:rgba(15,20,10,.65); backdrop-filter:blur(5px); }
.dialog-close { position:absolute; top:8px; right:14px; border:0; background:none; font-size:30px; line-height:1; padding:7px; }
.privacy-dialog h2 { font-size:34px; margin:20px 0; }
.privacy-dialog>p:not(.eyebrow) { font-size:13px; line-height:1.85; }
.privacy-dialog .text-link { margin-top:25px; font-size:12px; text-decoration:underline; text-underline-offset:5px; }
#privacy-status { font-size:11px; margin-top:12px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; top:-100px; left:15px; padding:12px 20px; background:var(--ink); color:white; z-index:100; }
.skip-link:focus { top:10px; }
:lang(zh-CN) h1 { font-size:clamp(47px,4.8vw,69px); line-height:1.25; letter-spacing:-.04em; }
:lang(zh-CN) h2,:lang(zh-CN) h3 { line-height:1.35; letter-spacing:-.025em; }
:lang(zh-CN) em { font-family:var(--font); font-style:normal; }
:lang(zh-CN) .contact-inner h2 { font-size:clamp(40px,4.7vw,64px); }
@media(max-width:1100px) {
  .shell { width:calc(100% - 64px); }
  .header-inner { gap:20px; }
  .desktop-nav { gap:24px; margin-right:10px; }
  .hero { gap:30px; }
  .hero h1 { font-size:6.5vw; }
  .hero-description { font-size:14px; }
  .section-heading,.contact-inner { gap:55px; }
  .practice-row { grid-template-columns:24px 1fr 1.2fr 20px; gap:20px; }
  .practice-row h3 { font-size:24px; }
}
@media(max-width:800px) {
  html { scroll-padding-top:80px; }
  .shell { width:calc(100% - 48px); }
  .header-inner { height:72px; }
  .wordmark { font-size:30px; }
  .brand-symbol { font-size:32px; }
  .desktop-nav { display:none; }
  .header-actions { margin-left:auto; gap:22px; }
  .menu-toggle { display:flex; width:25px; height:36px; flex-direction:column; justify-content:center; gap:5px; padding:0; border:0; background:none; }
  .menu-toggle>span:not(.sr-only) { width:23px; height:1px; background:var(--ink); }
  .menu-toggle[aria-expanded=true]>span:nth-child(2) { transform:translateY(3px) rotate(45deg); }
  .menu-toggle[aria-expanded=true]>span:nth-child(3) { transform:translateY(-3px) rotate(-45deg); }
  .section { padding-top:60px; padding-bottom:60px; }
  .hero { gap:24px; padding-top:28px; padding-bottom:32px; }
  .hero .eyebrow { font-size:8px; gap:8px; }
  .tiny-spark { font-size:18px; }
  .hero h1 { margin:25px 0 21px; }
  .hero-description { font-size:12px; }
  .hero .text-link { font-size:12px; margin-top:22px; gap:20px; }
  .art-label,.art-bottom { left:20px; right:20px; font-size:7px; }
  .art-caption { left:20px; right:20px; bottom:55px; font-size:21px; }
  .art-cross { font-size:43px; }
  .section-heading,.contact-inner { gap:35px; }
  .section-heading>p,.contact-details p { font-size:13px; }
  .practice-row { grid-template-columns:20px 1fr 1.2fr; gap:18px; }
  .practice-row h3 { font-size:23px; }
  .practice-row p { font-size:12px; }
  .practice-mark { display:none; }
  .study-grid { gap:20px; }
  .study-card h3 { font-size:21px; }
  .study-card figcaption { gap:12px; }
  .contact-email { font-size:22px; gap:15px; }
}
@media(max-width:600px) {
  .shell { width:calc(100% - 40px); }
  .header-inner { height:68px; gap:12px; }
  .wordmark { font-size:28px; gap:7px; }
  .brand-symbol { font-size:29px; }
  .header-actions { gap:20px; }
  .header-actions .button { display:none; }
  .hero { display:flex; flex-direction:column; gap:25px; padding-top:22px; padding-bottom:30px; }
  .hero-copy { padding:5px 0 0; align-self:stretch; }
  .hero h1 { font-size:clamp(48px,12.4vw,74px); line-height:1.03; margin:23px 0 20px; }
  .hero-description { font-size:13px; max-width:310px; }
  .hero .text-link { margin-top:20px; }
  .hero-art { aspect-ratio:1.2; }
  .art-label { top:20px; }
  .art-bottom { bottom:19px; }
  .art-caption { bottom:48px; font-size:21px; }
  .section { padding-top:46px; padding-bottom:46px; }
  .section-kicker { font-size:9px; gap:14px; }
  .section-heading { display:block; margin-bottom:28px; }
  .section-heading h2 { margin-top:20px; font-size:33px; }
  .section-heading>p { margin-top:21px; max-width:350px; font-size:13px; }
  .practice-row { grid-template-columns:19px 1fr; gap:9px 15px; padding:22px 0; align-items:baseline; }
  .practice-row h3 { font-size:24px; }
  .practice-row p { grid-column:2; font-size:12px; max-width:320px; }
  .practice-number { font-size:9px; }
  .study-grid { gap:16px; }
  .study-image { aspect-ratio:1.12; }
  .study-card figcaption { display:block; padding-top:12px; }
  .study-number { font-size:9px; display:block; margin-bottom:6px; }
  .study-card h3 { font-size:18px; line-height:1.22; letter-spacing:-.03em; }
  .study-card figcaption p { font-size:10px; line-height:1.5; margin-top:7px; }
  .concept-note { font-size:10px; margin-top:21px; max-width:320px; }
  .contact-inner { grid-template-columns:1fr; gap:27px; }
  .contact-inner h2 { margin-top:21px; font-size:48px; }
  .contact-details p { max-width:320px; margin-bottom:23px; }
  .contact-email { font-size:24px; gap:22px; }
  .footer-inner { gap:16px; padding:18px 0; font-size:9px; }
  .privacy-button,.back-top { font-size:10px; }
  .back-top { gap:12px; }
  .privacy-dialog { padding:40px 24px 26px; }
  .privacy-dialog h2 { font-size:29px; }
  :lang(zh-CN) .hero h1 { font-size:10.7vw; line-height:1.3; }
  :lang(zh-CN) .section-heading h2 { font-size:30px; }
  :lang(zh-CN) .practice-row h3 { font-size:22px; }
  :lang(zh-CN) .study-card h3 { font-size:18px; }
  :lang(zh-CN) .contact-inner h2 { font-size:40px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*:before,*:after { animation:none!important; transition:none!important; } }
