/* Art direction: a shared editorial canvas, ink typography, a single drawn gesture. */
:root{--paper:#f8f5fc;--ink:#2b153d;--purple:#492365;--line:rgba(62,34,82,.17)}
.site-header{background:#e6daf5;border-bottom:1px solid #4b2c6d19;height:86px}
.brand-cn{letter-spacing:.09em;font-weight:600}
.brand-en{font-size:12px;letter-spacing:.18em;font-weight:600}
.site-header .desktop-nav{font-size:12px;gap:35px}
.site-header .utility-nav{font-size:12px;gap:23px}
.age{width:33px;height:33px;font-size:11px;border-color:#51326270}
.hero{height:calc(100svh - 86px);min-height:800px;border-radius:0 0 50% 0 / 0 0 4% 0}
.hero:before{background:linear-gradient(90deg,#dfd0f4ba,transparent 56%)}
.hero-content{width:53%;padding-top:clamp(42px,6.2vh,85px);padding-bottom:70px}
.hero-content>.eyebrow{font-size:9px;letter-spacing:.26em;margin-bottom:25px;display:flex;align-items:center;gap:15px}
.hero-content>.eyebrow:before{content:"";display:block;height:1px;width:32px;background:#4221528c}
.hero h1{font-family:"Songti SC","STSong","SimSun",serif;font-weight:500;font-size:clamp(106px,11.8vw,180px);line-height:1.04;letter-spacing:-.075em}
.headline-row{display:block;overflow:hidden;padding-bottom:.13em;margin-bottom:-.13em}
.headline-row:last-child{padding-left:.34em}
.headline-word{display:inline-block}
.hero h1 .period{font-size:.6em;color:#72528f;margin-left:.02em;letter-spacing:0}
.hero-subtitle{font-size:clamp(26px,2.5vw,36px);font-weight:400;letter-spacing:.035em;margin-top:24px}
.hero-intro{font-size:13px;line-height:1.9;opacity:.74;margin-top:14px}
.hero .button{margin-top:24px;border:0;border-bottom:1px solid #42215280;border-radius:0;padding:10px 0;min-height:44px;gap:38px;background:none!important;font-size:13px}
.hero .button .icon{width:19px;height:19px}
.hero-aside{position:absolute;left:52%;top:7%;z-index:1;display:flex;flex-direction:column;gap:15px;pointer-events:none}
.hero-aside>span{font-size:8px;letter-spacing:.25em}
.hero-aside>em{font-family:Georgia,"Times New Roman",serif;font-size:clamp(35px,4vw,62px);line-height:.95;font-weight:400;letter-spacing:-.045em}
.hero-aside>small{font-size:11px;letter-spacing:.1em;margin-top:9px;opacity:.75}
.hero-gesture{position:absolute;top:18%;left:35%;width:36%;height:auto;z-index:0;overflow:visible;pointer-events:none;color:#583276}
.hero-gesture path{stroke:currentColor;stroke-width:1;fill:none;vector-effect:non-scaling-stroke;opacity:.48}
.hero-gesture circle{fill:#f6e6a0;stroke:#7f6894;stroke-width:.65;vector-effect:non-scaling-stroke}
.hero-note{top:auto;bottom:30px;right:var(--gutter);font-size:8px;letter-spacing:.2em;opacity:.75}
.hero-bottom-note{font-family:Georgia,"Times New Roman",serif;position:absolute;bottom:29px;left:49%;font-style:italic;font-size:17px;letter-spacing:.01em;opacity:.7}
.scroll-cue{bottom:23px;font-size:10px;letter-spacing:.13em}
.brand-manifesto{overflow:hidden;padding:65px 0 42px;background:var(--paper);position:relative;border-bottom:1px solid var(--line)}
.manifesto-track{display:flex;gap:38px;align-items:center;width:max-content;white-space:nowrap;position:relative;left:-3vw;color:#5e3c79;will-change:transform}
.manifesto-track>span{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:clamp(68px,8.8vw,145px);letter-spacing:-.065em;line-height:1.1;font-weight:400}
.manifesto-track>span:nth-of-type(2){color:transparent;-webkit-text-stroke:1px #6f4d87}
.manifesto-track>i{display:inline-block;width:45px;height:45px;flex-shrink:0;border:1px solid #80618e;border-radius:50%;position:relative}
.manifesto-track>i:after{content:"";position:absolute;inset:9px;background:#ecd88f;border-radius:50%}
.brand-manifesto>p{margin:24px var(--gutter) 0;font-size:10px;letter-spacing:.19em;color:#816b8d}
.story-section{background:var(--paper);padding-top:115px;padding-bottom:90px;gap:8vw;grid-template-columns:1fr 1.05fr}
.story-copy h2{font-size:clamp(40px,4.4vw,68px);line-height:1.32;letter-spacing:-.045em}
.story-copy>.eyebrow{color:#775b8c;font-size:9px;letter-spacing:.22em}
.story-copy>p:not(.eyebrow){font-size:14px;line-height:2.05;opacity:.8}
.story-image img{height:520px;border-radius:48% 48% 0 0 / 26% 26% 0 0}
.image-caption{margin-top:18px;letter-spacing:.16em;font-size:8px}
.home-products{background:var(--paper);padding-top:70px;padding-bottom:100px;column-gap:7vw;grid-template-columns:.9fr 1.2fr}
.home-products .section-intro h2{font-size:clamp(43px,4.7vw,72px);line-height:1.25}
.home-products .section-intro .eyebrow{color:#775b8c;font-size:9px}
.collection-visual{border-radius:50% 50% 45% 45% / 45% 45% 44% 44%;overflow:hidden;background:#e7def0}
.collection-visual img{border-radius:0;height:460px;object-position:65% center;mix-blend-mode:multiply}
.product-index{display:block;margin-top:60px;max-width:none}
.product-index>a,.product-index>a:first-child,.product-index>a:last-child{border-right:0;border-top:1px solid var(--line);padding:30px 0;gap:35px;align-items:center}
.product-index>a:last-child{border-bottom:1px solid var(--line)}
.index-no{font-family:Georgia,serif;font-size:15px;color:#87689b;margin:0}
.product-index>a>div{display:flex;align-items:center;gap:50px;flex:1}
.product-index h3{font-size:36px;font-weight:400;letter-spacing:.025em;min-width:190px}
.product-index p{margin:0;font-size:12px;opacity:.68}
.product-index>a>.icon{margin-top:0;width:26px;height:26px}
.cooperate-band{background:#301c43;color:#f1e8f8;padding-top:100px;padding-bottom:100px;grid-template-columns:1.25fr 1fr}
.cooperate-band>.eyebrow{color:#d7c78a;font-size:9px}
.cooperate-band h2{font-size:clamp(38px,4.7vw,72px);line-height:1.3;font-weight:400}
.cooperate-band>div p{color:#c4b1d3;font-size:12px;letter-spacing:.06em}
.cooperate-band .outline{border-color:#cdb7dd;color:#f0e7f7;background:none}
.cooperate-band .outline:hover{background:#ffffff0c}
.footer{background:#301c43;color:#e4d7ee;padding-top:55px;border-top:1px solid #eee2fb1c}
.footer-note{border-color:#f4eaff1f;opacity:.65}
.footer .brand-cn{font-size:27px}.footer .brand-en{font-size:10px}
.footer nav{color:#d0bfdf;font-size:11px}.footer>p{color:#d0bfdf}
.editorial-heading h1{font-weight:400;letter-spacing:-.035em}
.editorial-heading>.eyebrow{color:#775b8c;font-size:9px}
.editorial-heading>p:not(.eyebrow){font-size:16px;line-height:2;opacity:.85}
.principle-list article>span{color:#a48abb}
.services-list article{border-top-color:#bca9ca}
.product-feature{overflow:hidden}
.floating-contact{background:#3c1e59ef;box-shadow:0 5px 24px #32133d19;border:1px solid #e7d7f640;font-size:12px;gap:10px;padding:14px 20px}
.mobile-dock{box-shadow:0 7px 25px #35154d15}
@media(min-width:1800px){.hero h1{font-size:190px}}
@media(min-width:761px) and (max-height:780px){.hero{min-height:680px}.hero-content{padding-top:30px}.hero h1{font-size:clamp(90px,18vh,138px)}.hero-subtitle{font-size:28px;margin-top:18px}.hero-intro{font-size:12px;margin-top:12px}.hero .button{margin-top:18px}}
@media(min-width:761px) and (max-width:1150px){.hero-content{width:57%}.hero h1{font-size:clamp(115px,12vw,144px)}.hero-aside{left:56%;top:8%}.hero-gesture{left:34%;top:23%;width:42%}.product-index h3{min-width:150px;font-size:31px}.product-index>a>div{gap:25px}}
@media(max-width:760px){
 .site-header{height:72px;background:#e5d8f3;border-bottom:1px solid #4b2c6d16}
 .site-header .brand-cn{font-size:24px}.site-header .brand-en{font-size:10px;letter-spacing:.17em}
 .site-header .age{width:29px;height:29px;font-size:10px}
 .hero{min-height:800px;height:calc(100svh - 72px);border-radius:0 0 50% 0 / 0 0 2.5% 0}
 .hero-content{width:100%;padding:34px 24px 0}
 .hero-content>.eyebrow{font-size:7px;letter-spacing:.2em;gap:11px;margin-bottom:24px}
 .hero-content>.eyebrow:before{width:23px}
 .hero h1{font-size:clamp(90px,25.5vw,113px);font-weight:500;line-height:1.04;letter-spacing:-.075em}
 .headline-row:last-child{padding-left:.3em}
 .hero h1 .period{font-size:.58em}
 .hero-subtitle{font-size:25px;margin-top:23px;letter-spacing:.03em}
 .hero-intro{font-size:11px;margin-top:13px;line-height:1.9}
 .hero .button{margin-top:18px;padding:7px 0;min-height:44px;gap:29px;font-size:12px}
 .hero .button .icon{width:17px;height:17px}
 .hero-aside{left:auto;right:24px;top:42%;gap:9px;text-align:right}
 .hero-aside>span{font-size:6px;letter-spacing:.13em}
 .hero-aside>em{font-size:25px;line-height:1;letter-spacing:-.045em}
 .hero-aside>small{display:none}
 .hero-gesture{left:41%;top:21%;width:42%;opacity:.6}
 .hero-gesture path{stroke-width:.7}
 .hero-bottom-note,.hero-note{display:none}
 .brand-manifesto{padding:40px 0 28px}
 .manifesto-track{left:-45px;gap:23px}
 .manifesto-track>span{font-size:69px;line-height:1.12}
 .manifesto-track>i{width:26px;height:26px}
 .manifesto-track>i:after{inset:6px}
 .brand-manifesto>p{font-size:8px;letter-spacing:.15em;margin-top:18px}
 .story-section{padding:65px 24px 55px;gap:35px;grid-template-columns:1fr}
 .story-copy h2{font-size:37px;line-height:1.3}
 .story-copy>p:not(.eyebrow){font-size:12px;line-height:2;margin-top:22px}
 .story-copy .text-link{font-size:12px}
 .story-image img{height:320px;border-radius:48% 48% 0 0 / 24% 24% 0 0}
 .image-caption{font-size:7px;margin-top:13px}
 .home-products{padding:30px 24px 65px;grid-template-columns:1fr;gap:28px}
 .home-products .section-intro h2{font-size:39px;line-height:1.26}
 .home-products .section-intro p:last-child{font-size:12px}
 .collection-visual{border-radius:49% 49% 45% 45% / 40% 40% 45% 45%}
 .collection-visual img{height:300px;object-position:65% center}
 .product-index{margin-top:8px}
 .product-index>a,.product-index>a:first-child,.product-index>a:last-child{padding:22px 0;gap:20px}
 .product-index>a>div{display:block}
 .product-index h3{font-size:28px;min-width:0;letter-spacing:.015em}
 .product-index p{font-size:10px;margin-top:9px;line-height:1.8}
 .index-no{font-size:12px;align-self:flex-start;margin-top:7px}
 .product-index>a>.icon{width:22px;height:22px}
 .cooperate-band{padding:65px 24px;grid-template-columns:1fr;gap:25px}
 .cooperate-band h2{font-size:37px;line-height:1.3}
 .cooperate-band>div p{font-size:11px}
 .cooperate-band .outline{font-size:12px}
 .footer{padding-top:42px;padding-bottom:28px}
 .editorial-heading>p:not(.eyebrow){font-size:13px}
 .mobile-dock{border-radius:19px;background:#f6f0fce8}
}
@media(max-width:370px){.hero-content{padding-top:30px}.hero h1{font-size:84px}.hero-subtitle{font-size:23px}.hero-aside{top:43%;right:22px}.hero-aside>em{font-size:22px}.hero{min-height:780px}.story-copy h2{font-size:33px}}
@media(max-width:760px) and (max-height:740px){.hero{min-height:650px}.hero-content{padding-top:24px}.hero-content>.eyebrow{margin-bottom:17px}.hero h1{font-size:80px}.hero-subtitle{font-size:22px;margin-top:17px}.hero-intro{font-size:10px;margin-top:10px}.hero .button{margin-top:13px}.hero-aside{top:42%}.hero-aside>em{font-size:23px}.hero-aside>span{font-size:5px}}
@media(prefers-reduced-motion:reduce){.manifesto-track{will-change:auto}}

/* Motion study: independent pieces keep the original artwork intact. */
.hero-art{opacity:.26;filter:blur(2px)}
.closer-scene{position:absolute;left:55%;top:35%;width:38%;height:360px;z-index:1;pointer-events:none;perspective:900px}
.closer-orbit{position:absolute;left:-5%;top:35%;width:110%;height:46%;border:1px solid #79538a40;border-radius:50%;transform:rotate(-16deg)}
.play-token{position:absolute;width:122px;height:190px;top:7%;filter:drop-shadow(12px 25px 14px #32143e30);--light:#b28cdb;--mid:#75479d;--dark:#3e1d60}
.play-token i{position:absolute;width:73px;height:73px;border-radius:50%;left:24px;top:0;background:radial-gradient(circle at 31% 23%,#ffffff9c,transparent 40%),linear-gradient(125deg,var(--light),var(--mid) 60%,var(--dark));z-index:3;box-shadow:inset -7px -5px 10px #00000012}
.play-token b{position:absolute;top:58px;left:23px;width:76px;height:104px;border-radius:35% 35% 20% 20%;background:linear-gradient(100deg,var(--light),var(--mid) 58%,var(--dark));clip-path:polygon(24% 0,76% 0,70% 38%,100% 100%,0 100%,30% 38%);z-index:2}
.play-token span{position:absolute;width:120px;height:47px;border-radius:50%;bottom:0;background:linear-gradient(120deg,var(--light),var(--mid) 65%,var(--dark));box-shadow:inset 0 6px 2px #ffffff40,inset 0 -8px 2px #00000018;border-bottom:4px solid var(--dark)}
.token-purple{left:16%;transform:rotate(-9deg)}
.token-yellow{--light:#fff2b6;--mid:#e6c660;--dark:#ac8032;left:49%;top:16%;transform:rotate(10deg);z-index:4}
.closer-scene>p{position:absolute;top:84%;width:100%;text-align:center;font-size:9px;letter-spacing:.3em;color:#65437c}
.closer-scene>p>span{display:block;font-size:11px;letter-spacing:.15em;margin-top:12px;opacity:.7}
.product-index>a{position:relative;isolation:isolate;transition:padding .35s ease,color .35s ease}
.product-index>a:before{content:"";position:absolute;inset:0;background:#e9def2;transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.22,1,.36,1);z-index:-1}
.product-index>a:hover,.product-index>a:focus-visible{padding-left:22px;padding-right:22px;color:#66358b}
.product-index>a:hover:before,.product-index>a:focus-visible:before{transform:scaleX(1)}
.product-index>a>.icon{transition:transform .35s ease}
.product-index>a:hover>.icon,.product-index>a:focus-visible>.icon{transform:translate(4px,-4px)}
@media(max-width:760px){.closer-scene{left:25%;top:58%;width:66%;height:255px}.play-token{scale:.76;transform-origin:top left}.token-purple{left:19%}.token-yellow{left:51%}.closer-scene>p{top:75%;font-size:7px}.closer-scene>p>span{font-size:9px}.hero-art{opacity:.18}.product-index>a:hover,.product-index>a:focus-visible{padding-left:10px;padding-right:10px}}
@media(prefers-reduced-motion:reduce){.product-index>a,.product-index>a:before,.product-index>a>.icon{transition:none}}
.hero{background:#e5d7f2}
.hero-art{opacity:1;filter:none;background:radial-gradient(ellipse at 78% 48%,#f6e8c878,transparent 37%),radial-gradient(ellipse at 60% 78%,#aa86cf66,transparent 48%),linear-gradient(115deg,#e7dcf5,#d5c0e9);}
@media(min-width:761px){.play-token{scale:1.35;transform-origin:center bottom}.token-purple{left:22%}.token-yellow{left:49%}}
@media(max-width:760px){.hero-art{background:radial-gradient(ellipse at 65% 70%,#f9e8b75e,transparent 46%),linear-gradient(150deg,#e7dcf5,#ceb5e5)}}
