@font-face{font-family:WindSong;src:url('/assets/fonts/windsong.ttf') format('truetype');font-display:swap}
@font-face{font-family:YuanFandol;src:url('/assets/fonts/yuan-fandol-subset.otf?v=20261105c') format('opentype');font-display:swap}
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.45s;animation-timing-function:cubic-bezier(.3,0,.2,1)}

:root{
  --black:#050505;--night:#0c0c0b;--card:#121211;--line:rgba(242,240,232,.12);
  --paper:#f2f0e8;--dim:rgba(242,240,232,.58);--lime:#d9f35f;--gold:#e3c58c;--aqua:#78d5cc;
  --sans:"DM Sans",Arial,sans-serif;--serif:"Instrument Serif",Georgia,serif;--mono:"DM Mono",ui-monospace,Menlo,monospace;
  --han:YuanFandol,"Songti SC","Noto Serif CJK SC",serif;
  --g:clamp(20px,3.4vw,56px);--ease:cubic-bezier(.2,.7,.1,1);--r:14px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--black);color:var(--paper);font:400 16px/1.55 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
i{font-family:var(--serif);font-style:italic;font-weight:400}
.han,[lang="zh-CN"]{font-family:var(--han);font-style:normal}
::selection{background:var(--lime);color:var(--black)}
:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0}
.skip{position:fixed;left:12px;top:-80px;z-index:200;background:var(--lime);color:var(--black);padding:10px 14px}
.skip:focus{top:12px}
.arrow{width:.72em;height:.72em;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-left:.2em;vertical-align:.02em;transition:transform .4s var(--ease)}
a:hover .arrow{transform:translate(2px,-2px)}

/* ---- logo ---- */
.logo{display:inline-flex;align-items:center;gap:11px;font:400 23px/1 var(--serif);letter-spacing:-.005em;white-space:nowrap}
.logo i{font-style:italic}
.mark{width:33px;height:24px;flex:none;overflow:visible}
.mark circle{fill:none;stroke-width:1.5;transition:transform .9s var(--ease)}
.mark-a{stroke:currentColor}
.mark-b{stroke:var(--lime)}
.logo:hover .mark-a{transform:translateX(3px)}
.logo:hover .mark-b{transform:translateX(-3px)}

/* ---- top ---- */
.top{position:fixed;inset:0 0 auto;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:16px var(--g);background:linear-gradient(rgba(5,5,5,.8),rgba(5,5,5,0))}
.top-nav{display:flex;align-items:center;gap:clamp(16px,2.2vw,32px);font-size:14px}
.top-nav a{position:relative;opacity:.78;transition:opacity .25s}
.top-nav a:hover,.top-nav a[aria-current]{opacity:1}
.top-nav a[aria-current]::after{content:"";position:absolute;left:50%;bottom:-8px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--lime)}
.top-contact{padding:7px 14px;border:1px solid var(--line);border-radius:999px;opacity:1!important}
.top-contact:hover{border-color:currentColor}
.top-menu{display:none;font:500 14px/1 var(--sans);color:inherit;background:none;border:1px solid var(--line);border-radius:999px;padding:8px 14px;cursor:pointer}
.menu{position:fixed;inset:0;z-index:90;background:var(--black);color:var(--paper);display:flex;align-items:flex-end;padding:0 var(--g) 10vh;opacity:0;transition:opacity .35s var(--ease)}
.menu[hidden]{display:none}
.menu.is-open{opacity:1}
.menu nav{display:flex;flex-direction:column}
.menu a{font:400 clamp(48px,13vw,104px)/1.02 var(--serif);letter-spacing:-.02em;transform:translateY(18px);opacity:0;transition:transform .6s var(--ease),opacity .6s var(--ease)}
.menu.is-open a{transform:none;opacity:1}
.menu-open{overflow:hidden}

/* ---- hero: the face of a life ---- */
.hero{position:relative;height:340vh;background:#000}
.hero-stage{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden}
.mosaic{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.4s var(--ease)}
.hero.is-ready .mosaic{opacity:1}
.hero-copy{position:absolute;left:var(--g);bottom:clamp(30px,6vh,64px);z-index:2;max-width:min(640px,50vw);pointer-events:none;color:var(--paper)}
.hero-title{margin:0;font:400 clamp(64px,8.6vw,150px)/.9 var(--serif);letter-spacing:-.045em}
.hero-title i{font-style:italic}
.hero-words{margin:22px 0 0;max-width:30em;font:400 clamp(17px,1.4vw,22px)/1.4 var(--sans);opacity:.8}
body.hero-light .top{background:linear-gradient(rgba(246,244,238,.92),rgba(246,244,238,0));color:#141414}
body.hero-light .top-contact,body.hero-light .top-menu{border-color:rgba(20,20,20,.25)}
.mosaic-peek{position:fixed;left:0;top:0;z-index:70;width:200px;height:200px;border-radius:12px;background-repeat:no-repeat;box-shadow:0 30px 60px -20px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.12);pointer-events:none;opacity:0;transition:opacity .25s}
.mosaic-peek.on{opacity:1}
.scroll-hint{position:absolute;right:var(--g);bottom:clamp(30px,6vh,64px);z-index:2;margin:0;display:flex;flex-direction:column;align-items:center;gap:10px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(242,240,232,.75);pointer-events:none}
.scroll-hint i{position:relative;display:block;width:1px;height:44px;background:rgba(242,240,232,.25);overflow:hidden}
.scroll-hint i::after{content:"";position:absolute;left:0;top:-40%;width:1px;height:40%;background:var(--paper);animation:hint 1.8s cubic-bezier(.6,0,.3,1) infinite}
@keyframes hint{to{top:100%}}
@media (hover:none){.mosaic-peek{display:none}}
@media (prefers-reduced-motion:reduce){.hero{height:100svh}}

/* ---- blocks ---- */
.block{padding:clamp(64px,10vh,120px) var(--g) 0}
.block-title{margin:0 0 28px;font:400 clamp(30px,3vw,44px)/1 var(--serif);letter-spacing:-.015em}
.page-head{padding:clamp(130px,20vh,200px) var(--g) 0}
.page-title{margin:0;font:400 clamp(64px,10vw,170px)/.86 var(--serif);letter-spacing:-.045em}
.page-sub{margin:22px 0 0;max-width:38em;font-size:clamp(18px,1.6vw,24px);color:var(--dim)}
.more{margin:20px 0 0;font-size:15px}
.more a{border-bottom:1px solid currentColor;padding-bottom:2px}

/* ---- cards: small, premium ---- */
.cards{display:grid;gap:clamp(14px,1.6vw,22px)}
.cards-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cards-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cards-6{grid-template-columns:repeat(6,minmax(0,1fr))}
.cards-catalog{grid-template-columns:repeat(5,minmax(0,1fr))}
.card{display:flex;flex-direction:column;gap:14px;min-width:0}
.card-media{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;border-radius:var(--r);background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.card:hover .card-media img{transform:scale(1.045)}
.card-cap{display:flex;flex-direction:column;gap:4px;padding:0 2px}
.card-title{font:500 16px/1.3 var(--sans);letter-spacing:-.005em}
.card-line{font-size:14px;line-height:1.45;color:var(--dim)}
.card-meta{margin-top:4px;font:400 12px/1.4 var(--mono);letter-spacing:.02em;color:var(--dim)}
.card:hover .card-title{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.card-type{display:flex;align-items:flex-end;padding:20px;background:linear-gradient(160deg,#1c1c1a,#0d0d0c)}
.card-type > span{font:400 clamp(20px,1.8vw,28px)/1.12 var(--serif);letter-spacing:-.01em}
.card-text .card-media{aspect-ratio:16/9}
.card-more .card-type{background:none}

/* catalog */
.cards-catalog .card-media{aspect-ratio:3/4}
.cards-catalog .card-title{font:400 30px/1 var(--serif);letter-spacing:-.02em}
.cards-catalog .card:hover .card-title{text-decoration:none;font-style:italic}
.cat-media .card-media img{object-position:50% 25%}

/* builds: screenshot on a tinted mat */
.framed{display:grid;place-items:center;padding:9%}
.framed img{height:auto;border-radius:6px;box-shadow:0 18px 40px -18px rgba(0,0,0,.7)}
.card:hover .framed img{transform:scale(1.03) translateY(-2%)}
.b-nobie .framed{background:radial-gradient(120% 90% at 50% 0%,#2b3f73,#0d1326)}
.b-wc26 .framed{background:radial-gradient(120% 90% at 50% 0%,#f6f6f2,#cfcfc6)}
.b-tangseng .framed{background:radial-gradient(120% 90% at 50% 0%,#ffe5b8,#ff9d7e)}

/* life */
.card-season .card-media{aspect-ratio:4/5}
.card-book .card-media{aspect-ratio:2/3;background:#1a1916}
.card-book .card-title{font-size:15px}
.plans-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:start}
.plans-quote{margin:0;font:400 clamp(24px,2.3vw,34px)/1.2 var(--serif)}
.plans-list{list-style:none;margin:0;padding:0;columns:2;column-gap:32px;font-size:17px}
.plans-list li{padding:11px 0;border-top:1px solid var(--line);break-inside:avoid}
.village-link{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:30px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.village-mark{font:400 clamp(38px,5vw,76px)/1.2 WindSong,cursive}
.village-url{font-size:15px;color:var(--dim)}

/* events */
.event-up{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:clamp(20px,3vw,44px);align-items:center;max-width:1100px;padding:clamp(14px,1.4vw,20px);border-radius:calc(var(--r) + 6px);background:var(--card);box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .4s}
.event-up:hover{box-shadow:inset 0 0 0 1px rgba(217,243,95,.5)}
.event-up img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--r)}
.event-up-text{display:flex;flex-direction:column;gap:8px}
.event-up time{font:400 13px/1 var(--mono);color:var(--lime)}
.event-title{font:400 clamp(30px,3.4vw,52px)/1.02 var(--serif);letter-spacing:-.02em}
.event-place,.event-host{color:var(--dim)}
.event-go{margin-top:12px;display:inline-flex;align-self:flex-start;padding:10px 16px;border-radius:999px;background:var(--lime);color:var(--black);font-weight:500;font-size:15px}
.card-event .card-type > span{font-size:clamp(19px,1.6vw,24px)}
.card-event .card-type{background:radial-gradient(100% 120% at 85% 0%,#3a2d14,#0f0d09)}
.card-group .card-media{aspect-ratio:16/9}
.card-group-type .card-type{background:radial-gradient(90% 120% at 80% 0%,#3c2a52,#120e18)}

/* news */
.news-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.news-list a{display:grid;grid-template-columns:140px minmax(0,1fr) auto;gap:24px;align-items:baseline;padding:20px 0;border-bottom:1px solid var(--line);transition:padding .5s var(--ease)}
.news-list a:hover{padding-left:12px}
.news-list time{font:400 13px/1 var(--mono);color:var(--dim)}
.news-title{font:400 clamp(20px,1.9vw,28px)/1.2 var(--serif)}
.news-where{font-size:14px;color:var(--dim)}

/* pro */
.pro{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:start;max-width:1100px}
.pro-photo{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--r)}
.pro-text p{margin:0 0 16px;font:400 clamp(22px,2vw,30px)/1.25 var(--serif)}
.pro-text .pro-link{font:500 15px/1 var(--sans)}
.pro-link a{border-bottom:1px solid currentColor;padding-bottom:2px}

/* media */
.show-head,.film-head{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:end;margin-bottom:36px}
.film-head{grid-template-columns:1fr;max-width:900px}
.show-cover{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--r)}
.show-title{margin:0;font:400 clamp(40px,5vw,80px)/.95 var(--serif);letter-spacing:-.03em}
.show-title .han{font-size:.7em;color:var(--gold)}
.show-title i{color:var(--dim)}
.show-intro{margin:16px 0 0;max-width:34em;font-size:17px;color:var(--dim)}
.eps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.ep{padding:24px;border-radius:var(--r);background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.ep-date{margin:0 0 12px;font:400 12px/1 var(--mono);color:var(--dim)}
.ep h3{margin:0 0 10px;font-size:clamp(19px,1.6vw,23px);line-height:1.5;font-weight:400}
.ep-en{margin:0 0 20px;font:italic 400 18px/1.35 var(--serif);color:var(--dim)}
.embed-audio iframe{width:100%;height:152px;border:0;border-radius:10px}
.play{display:inline-flex;align-items:center;gap:10px;padding:0;border:0;background:none;color:inherit;font:500 14px/1 var(--sans);cursor:pointer}
.play svg{width:38px;height:38px;padding:12px 11px 12px 13px;border:1px solid currentColor;border-radius:50%;fill:currentColor;transition:background .3s,color .3s}
.play:hover svg{background:var(--paper);color:var(--black)}
.film{padding-top:clamp(90px,14vh,150px)}
.vids{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.vid h3{margin:14px 0 4px;font-size:15px;line-height:1.4;font-weight:500}
.vid-date{margin:0;font:400 12px/1.4 var(--mono);color:var(--dim)}
.embed-video{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:var(--r);background:#111}
.embed-video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.embed-video:hover img{transform:scale(1.04)}
.embed-video .play{position:absolute;inset:0;justify-content:center;width:100%}
.embed-video .play svg{width:48px;height:48px;padding:16px 14px 16px 17px;background:rgba(5,5,5,.55);border-color:#fff;color:#fff;backdrop-filter:blur(6px)}
.embed-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---- footer + signup ---- */
.foot{margin-top:clamp(90px,14vh,160px);padding:clamp(80px,12vh,130px) var(--g) 32px;border-top:1px solid var(--line);background:var(--black);color:var(--paper)}
.signup{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 56px;align-items:end;padding-bottom:clamp(70px,10vh,110px)}
.signup-title{margin:0;font:400 clamp(52px,7.4vw,128px)/.9 var(--serif);letter-spacing:-.04em}
.signup-form{position:relative;display:flex;flex-wrap:wrap;gap:10px}
.signup-form input[type=email]{flex:1 1 220px;min-width:0;padding:15px 18px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--paper);font:400 16px/1 var(--sans)}
.signup-form input[type=email]::placeholder{color:var(--dim)}
.signup-form input[type=email]:focus{outline:none;border-color:var(--paper)}
.signup-form button{padding:15px 22px;border:0;border-radius:999px;background:var(--lime);color:var(--black);font:500 15px/1 var(--sans);cursor:pointer}
.signup-form button:disabled{opacity:.6;cursor:wait}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.signup-msg{flex-basis:100%;margin:6px 0 0;min-height:1.4em;font-size:14px;color:var(--dim)}
.signup-or{grid-column:2;margin:0;font-size:14px;color:var(--dim)}
.signup-or a{color:var(--paper);border-bottom:1px solid var(--line)}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:28px;padding-top:36px;border-top:1px solid var(--line);font-size:14px}
.foot-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.foot-grid ul a{color:var(--dim);transition:color .2s}
.foot-grid ul a:hover{color:var(--paper)}
.foot-copy{margin:44px 0 0;font:400 12px/1 var(--mono);color:var(--dim)}

/* ---- fade ---- */
.js .fade{opacity:0;transform:translateY(24px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.js .fade.in{opacity:1;transform:none}

/* ---- story ---- */
.story{padding:clamp(130px,22vh,220px) var(--g) 0}
.story-title{margin:0 0 clamp(70px,12vh,150px);font:400 clamp(60px,10.5vw,190px)/.86 var(--serif);letter-spacing:-.04em}
.story-title span,.story-title i{display:block}
.story-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(32px,6vw,110px);align-items:start}
.story-portrait{margin:0;position:sticky;top:100px}
.story-portrait img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 30%;border-radius:var(--r)}
.story-text{max-width:640px;font-size:clamp(17px,1.3vw,20px);line-height:1.65;color:rgba(242,240,232,.86)}
.story-text p{margin:0 0 1.3em}
.story-text strong{color:#fff;font-weight:600}
.story-text .pull{margin:1.3em 0 1em;font:italic 400 clamp(42px,5vw,84px)/.98 var(--serif);letter-spacing:-.025em;color:#fff}
.story-text .story-close{margin:2em 0 0;font:400 clamp(48px,6vw,96px)/.9 var(--serif);letter-spacing:-.035em;color:var(--lime)}

/* ---- essay ---- */
.is-essay{background:var(--paper);color:#172321}
.is-essay .top{background:linear-gradient(rgba(242,240,232,.94),rgba(242,240,232,0));color:#172321}
.is-essay .top-contact,.is-essay .top-menu{border-color:rgba(23,35,33,.25)}
.essay-wrap{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:clamp(40px,7vw,110px);max-width:1160px;margin:0 auto;padding:clamp(140px,20vh,200px) var(--g) 0}
.essay-date{margin:0 0 16px;font:400 13px/1 var(--mono);color:rgba(23,35,33,.6)}
.essay-head{margin-bottom:56px}
.essay-head h1{margin:0;font:400 clamp(42px,5.4vw,80px)/.98 var(--serif);letter-spacing:-.025em}
.essay-note{margin:24px 0 0;max-width:36em;font:italic 400 19px/1.4 var(--serif);color:rgba(23,35,33,.7)}
.essay-where{display:flex;flex-wrap:wrap;gap:8px 24px;margin:20px 0 0;font-size:14px}
.essay-where a{border-bottom:1px solid rgba(23,35,33,.4);padding-bottom:2px}
.essay-body{max-width:66ch;font-size:19px;line-height:1.75}
.essay-body h2{margin:64px 0 16px;font:400 clamp(30px,3vw,42px)/1.08 var(--serif)}
.essay-body p{margin:0 0 1.15em}
.essay-end{margin-top:56px;padding-top:24px;border-top:1px solid rgba(23,35,33,.2);font:italic 400 19px/1.5 var(--serif)}
.rail-inner{position:sticky;top:110px;display:flex;gap:16px}
.rail-line{position:relative;flex:none;width:1px;background:rgba(23,35,33,.18)}
.rail-line span{position:absolute;left:0;top:0;width:1px;height:0;background:#172321}
.essay-rail ol{list-style:none;margin:0;padding:0;font-size:14px;line-height:1.35}
.essay-rail li{margin:0 0 14px}
.essay-rail a{opacity:.5;transition:opacity .3s}
.essay-rail a:hover,.essay-rail a.on{opacity:1}

/* ---- responsive ---- */
@media (max-width:1100px){
  .cards-catalog{grid-template-columns:repeat(5,minmax(210px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(var(--g) * -1);padding:0 var(--g) 6px;scrollbar-width:none}
  .cards-catalog::-webkit-scrollbar{display:none}
  .cards-catalog .card{scroll-snap-align:start}
  .cards-6{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vids{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .top-nav{display:none}
  .top-menu{display:block}
  .cards-3,.cards-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .signup{grid-template-columns:1fr}
  .signup-or{grid-column:1}
  .foot-grid{grid-template-columns:1fr 1fr}
  .story-grid{grid-template-columns:1fr}
  .story-portrait{position:static;max-width:360px}
  .plans-grid{grid-template-columns:1fr}
  .essay-wrap{grid-template-columns:1fr}
  .essay-rail{display:none}
  .event-up{grid-template-columns:1fr}
  .event-up img{aspect-ratio:16/10}
}
@media (max-width:620px){
  .cards-2,.cards-3,.eps,.vids{grid-template-columns:1fr}
  .cards-4,.cards-6{grid-template-columns:repeat(2,minmax(0,1fr))}
  .news-list a{grid-template-columns:1fr;gap:6px}
  .pro,.show-head{grid-template-columns:1fr}
  .pro-photo,.show-cover{max-width:200px}
  .plans-list{columns:1}
  .village-link{flex-direction:column}
  .hero-copy{max-width:none;right:var(--g);bottom:84px}
  .scroll-hint{right:auto;left:50%;transform:translateX(-50%);bottom:16px}
  .scroll-hint i{height:26px}
  .hero-title{font-size:clamp(54px,15vw,84px)}
  .hero-words{font-size:16px;margin-top:14px}
  .hero{height:280vh}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important}
  .js .fade{opacity:1;transform:none}
}

/* ---- catalog video ---- */
.card-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s}
.playing .card-media video,.playing .village-media video{opacity:1}

/* ---- bio ---- */
.bio-short-grid{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start;max-width:1000px}
.bio-short-grid img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--r)}
.bio-short-grid p{margin:0 0 14px;font:400 clamp(21px,1.9vw,28px)/1.28 var(--serif)}
.bio-short-grid .more{font:500 15px/1 var(--sans);margin-top:18px}
.bio-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(32px,5vw,90px);align-items:start}
.bio-photo{margin:0;position:sticky;top:100px}
.bio-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:62% 30%;border-radius:var(--r)}
.bio-text{max-width:620px;font-size:clamp(17px,1.25vw,19px);line-height:1.65;color:rgba(242,240,232,.86)}
.bio-text p{margin:0 0 1.2em}
.bio-text a{color:var(--paper);border-bottom:1px solid var(--line)}
.bio-text .bio-lead{font:400 clamp(28px,2.6vw,40px)/1.15 var(--serif);color:var(--paper)}
.bio-text .more{display:flex;gap:24px}
.bio-text .more a{border-color:currentColor}

/* ---- work: feature + career ---- */
.feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;max-width:1240px;border-radius:calc(var(--r) + 6px);overflow:hidden;background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.feature-media{position:relative;min-height:340px;overflow:hidden}
.feature-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.feature:hover .feature-media img{transform:scale(1.04)}
.feature .fic-mark{position:absolute;left:28px;top:26px;font:600 clamp(40px,4.4vw,68px)/.86 var(--sans);letter-spacing:-.055em;color:#fff}
.feature .fic-mark i{font-weight:400;letter-spacing:-.03em}
.feature-text{display:flex;flex-direction:column;justify-content:center;gap:14px;padding:clamp(26px,3.4vw,52px)}
.feature-title{font:600 clamp(28px,2.8vw,42px)/1.04 var(--sans);letter-spacing:-.035em}
.feature-title i{font-weight:400}
.feature-line{color:var(--dim);max-width:34em}
.feature-list{display:flex;flex-direction:column;gap:6px;margin-top:6px;padding-top:14px;border-top:1px solid var(--line);font-size:14px}
.career{max-width:1000px}
.career-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.career-list li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:24px;padding:20px 0;border-bottom:1px solid var(--line)}
.career-where{font:400 clamp(21px,1.9vw,28px)/1.15 var(--serif)}
.career-what{color:var(--dim)}

/* ---- life: village preview ---- */
.village-preview{position:relative;display:block;max-width:1240px;aspect-ratio:16/8;border-radius:calc(var(--r) + 6px);overflow:hidden;background:#111;color:#fff}
.village-media,.village-media img,.village-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.village-media img{transition:transform 1.6s var(--ease)}
.village-media video{opacity:0;transition:opacity .8s}
.village-preview:hover .village-media img{transform:scale(1.03)}
.village-over{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;text-shadow:0 2px 30px rgba(0,0,0,.35)}
.village-small{font-size:16px}
.village-name{font:400 clamp(44px,6vw,96px)/1 var(--serif);letter-spacing:.04em;text-transform:uppercase}
.village-foot{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:22px 28px;background:linear-gradient(transparent,rgba(0,0,0,.55))}
.village-foot .village-mark{font:400 clamp(28px,3vw,46px)/1.2 WindSong,cursive}
.village-foot .village-url{font-size:14px;opacity:.85}

/* ---- media: lead video ---- */
.vid-lead{grid-column:span 2;grid-row:span 2}
.vid-lead h3{font:400 clamp(26px,2.4vw,36px)/1.1 var(--serif)}
.credit{margin:6px 0 0;font-size:11px;color:var(--dim)}
.credit a{border-bottom:1px solid var(--line)}

@media (max-width:900px){
  .feature{grid-template-columns:1fr}
  .bio-grid{grid-template-columns:1fr}
  .bio-photo{position:static;max-width:420px}
  .village-preview{aspect-ratio:4/3}
}
@media (max-width:620px){
  .bio-short-grid{grid-template-columns:1fr}
  .bio-short-grid img{max-width:160px}
  .career-list li{grid-template-columns:1fr;gap:6px}
  .vid-lead{grid-column:auto;grid-row:auto}
  .village-foot{flex-direction:column}
}