/* 2026-10 polish: carry the editorial language (serif, champagne gold, hairlines)
   through experience, projects, skills and footer; retire the leftover blue tech accents. */
.editorial-site{--serif:Georgia,'Songti SC','Noto Serif CJK SC','SimSun',serif;--latin:Georgia,'Times New Roman',serif;--gold:#c6aa7d;--gold-a:198,170,125}

/* hero: the outlined "STEVE" ghost fought with the portrait */
.editorial-cover .hero-mark{display:none}

/* section heads */
.editorial-site .sec-head h2{letter-spacing:.02em}
.editorial-site .sec-sup{font-family:var(--latin);font-style:italic;color:var(--gold)}
.editorial-site .sec-head::after{background:linear-gradient(90deg,var(--gold) 0%,rgba(var(--gold-a),.35) 55%,rgba(var(--gold-a),.04) 100%)}

/* experience */
.editorial-site .work-card{background:#171715;border-color:var(--line)}
.editorial-site .work-card:hover{border-color:rgba(var(--gold-a),.4)}
.editorial-site .work-card::before{background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgba(var(--gold-a),.08),transparent 65%)}
.editorial-site .work-card::after,.editorial-site .panel::after{background:linear-gradient(100deg,transparent 0%,rgba(255,250,240,.03) 35%,rgba(var(--gold-a),.09) 50%,rgba(255,250,240,.03) 65%,transparent 100%)}
.editorial-site .work-card.lit .wc-node{background:var(--gold);box-shadow:0 0 12px rgba(var(--gold-a),.7)}
.editorial-site .wc-num{font-family:var(--latin);font-style:italic;font-weight:400;font-size:60px;letter-spacing:-.04em;color:rgba(var(--gold-a),.32)}
.editorial-site .wc-period{color:#8f8a7f}
.editorial-site .wc-org{color:var(--gold);letter-spacing:.16em}
.editorial-site .wc-main h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.45rem,2.3vw,1.9rem);letter-spacing:.03em;line-height:1.45}
.editorial-site .wc-desc{color:#a6a297;font-size:14px;line-height:2.05}
.editorial-site .wc-tags li{border-color:rgba(var(--gold-a),.2);color:#a39d90;background:rgba(var(--gold-a),.03)}
.editorial-site .wc-tags li:hover{border-color:rgba(var(--gold-a),.55);color:var(--ink)}
.editorial-site .wc-media{border-color:rgba(var(--gold-a),.18)}
@media (min-width:769px){.editorial-site .wc-media{align-self:start;aspect-ratio:3/4}}

/* projects */
.editorial-site .panel{background:#171715;border-color:var(--line)}
.editorial-site .panel:hover{border-color:rgba(var(--gold-a),.4)}
.editorial-site .panel::before{background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgba(var(--gold-a),.08),transparent 65%)}
.editorial-site .cnrs{--c:rgba(198,170,125,.75);opacity:.35;background:linear-gradient(var(--c),var(--c)) left top/16px 1px,linear-gradient(var(--c),var(--c)) left top/1px 16px,linear-gradient(var(--c),var(--c)) right top/16px 1px,linear-gradient(var(--c),var(--c)) right top/1px 16px,linear-gradient(var(--c),var(--c)) left bottom/16px 1px,linear-gradient(var(--c),var(--c)) left bottom/1px 16px,linear-gradient(var(--c),var(--c)) right bottom/16px 1px,linear-gradient(var(--c),var(--c)) right bottom/1px 16px;background-repeat:no-repeat}
.editorial-site .p-num{font-family:var(--latin);font-style:italic;font-weight:400;letter-spacing:-.05em;color:rgba(var(--gold-a),.26);-webkit-text-stroke:0}
.editorial-site .p-year{border-color:rgba(var(--gold-a),.28);color:#b5ad9d;font-size:11px}
.editorial-site .p-name{font-family:var(--serif);font-weight:400;letter-spacing:.02em;line-height:1.35}
.editorial-site .p-sub{color:var(--gold);font-size:11.5px;letter-spacing:.12em}
.editorial-site .p-desc{color:#a6a297;font-size:14.5px;line-height:2.05}
.editorial-site .p-hint a{color:var(--gold);border-bottom-color:rgba(var(--gold-a),.6)}
.editorial-site .p-hint a:hover{color:#e3cca9;text-shadow:none}
.editorial-site .p-media img{border-color:rgba(var(--gold-a),.18)}
@media (min-width:1001px){
  /* wide panels read as a magazine spread: title column + text column, no dead space */
  .editorial-site .panel{min-height:0;padding:40px 44px 44px}
  .editorial-site .panel-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:56px;row-gap:12px;align-content:start;margin-top:36px}
  .editorial-site .p-name,.editorial-site .p-sub{grid-column:1}
  .editorial-site .p-name{font-size:clamp(1.7rem,2.3vw,2.2rem)}
  .editorial-site .p-desc,.editorial-site .p-hint,.editorial-site .p-media{grid-column:2}
  .editorial-site .p-desc{grid-row:1 / span 2;align-self:end;border-left:1px solid rgba(var(--gold-a),.2);padding-left:28px}
  .editorial-site .p-hint{padding-top:6px;padding-left:29px}
  .editorial-site .p-media{grid-column:1 / -1;padding-top:26px}
  .editorial-site .p-media img{height:170px}
  .editorial-site .p-num{font-size:clamp(4.4rem,8vw,6.6rem)}
}

/* skills */
.editorial-site .skill-cat{font-family:var(--serif);font-weight:400;letter-spacing:.06em}
.editorial-site .skill-cat small{color:var(--gold)}
.editorial-site .skill-items span{color:#a6a297}
.editorial-site .skill-items span:hover{color:var(--ink);text-shadow:none}

/* footer */
.editorial-site .footer{background:#141413}
.editorial-site .footer::before{background:radial-gradient(circle,rgba(var(--gold-a),.10) 0%,transparent 60%)}
.editorial-site .footer .kicker{color:var(--gold)}
.editorial-site .foot-big{font-family:var(--serif);font-weight:400;letter-spacing:.03em;line-height:1.35}
.editorial-site .foot-big a{color:var(--gold);border-bottom:1px solid rgba(var(--gold-a),.7);font-family:var(--serif)}
.editorial-site .foot-big a:hover{text-shadow:none;color:#e3cca9}
.editorial-site .foot-note{color:#a6a297}
.editorial-site .mail-cta{border-color:rgba(var(--gold-a),.28)}
.editorial-site .mail-go{background:var(--gold);color:#1a1814}
.editorial-site .mail-fb{color:var(--gold)}

/* mobile hero: the edition badge sat flush against the CTA buttons */
@media (max-width:768px){
  .editorial-cover .status-badge{grid-row:5;justify-self:start;margin:22px 20px 0;font-size:9px;padding:6px 11px}
  .editorial-site .wc-num{font-size:34px}
  .editorial-site .wc-media img[src*="forum"]{object-position:50% 38%}
  .editorial-site .p-num{font-size:40px}
  .editorial-site .foot-big{font-size:30px;line-height:1.55}
}
@media (max-width:1000px){.editorial-site .p-desc{border-left:0;padding-left:0}}
.editorial-site .p-name,.editorial-site .wc-main h3,.editorial-site .foot-big{text-wrap:balance}
@media (max-width:768px){.editorial-site .socials{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- motion layer (see assets/motion.js) ---------- */
/* finale signature: pen traces the outline, ink settles in, then the underline flourish */
.editorial-site .story-finale .story-signoff{flex-direction:column;gap:12px}
.editorial-site .story-finale .story-signoff>span.sg{display:block;font-size:0;line-height:0}
.sg svg{display:block;width:clamp(250px,26vw,340px);height:auto;overflow:visible}
.sg-t{font:56px 'Great Vibes','Segoe Script','Apple Chancery',cursive;fill:#d0b589;stroke:#d0b589;stroke-width:0;paint-order:stroke}
.sg-f{fill:none;stroke:#c6aa7d;stroke-width:1.1;stroke-linecap:round;opacity:.75}
@media (prefers-reduced-motion:no-preference){
  .sg.sg-arm .sg-t{fill:rgba(208,181,137,0);stroke:rgba(208,181,137,.9);stroke-width:.55;stroke-dasharray:720;stroke-dashoffset:720}
  .sg.sg-arm .sg-f{stroke-dasharray:300;stroke-dashoffset:300}
  .sg.sg-arm.sg-play .sg-t{animation:sgTrace 2.6s cubic-bezier(.5,.05,.3,1) forwards,sgInk 1.3s 1.7s ease forwards}
  .sg.sg-arm.sg-play .sg-f{animation:sgTrace 1.1s 2.5s cubic-bezier(.5,.05,.25,1) forwards}
}
@keyframes sgTrace{to{stroke-dashoffset:0}}
@keyframes sgInk{to{fill:#d0b589;stroke:rgba(208,181,137,0)}}
@media (max-width:768px){.sg svg{width:min(270px,72vw)}.editorial-site .story-finale .story-signoff{gap:8px}}
/* touch screens: one-shot entrances; the doubled class beats mobile.css's !important resets */
html.mo .editorial-site .mo-pre.mo-pre{opacity:0!important;transform:translate3d(0,22px,0)!important;transition:none!important}
html.mo .editorial-site .mo-pre.mo-in{opacity:1!important;transform:translate3d(0,0,0)!important;transition:opacity .75s cubic-bezier(.16,1,.3,1) var(--mo-d,0ms),transform .9s cubic-bezier(.16,1,.3,1) var(--mo-d,0ms)!important}
html.mo .editorial-site .mo-pre img{transform:scale(1.07);transition:none}
html.mo .editorial-site .mo-pre.mo-in img{transform:scale(1);transition:transform 1.4s cubic-bezier(.16,1,.3,1) var(--mo-d,0ms)}
html.mo .editorial-site .sec-head::after{display:block;transform:none}
html.mo .editorial-site .sec-head.mo-pre::after{transform:scaleX(0);transform-origin:0 50%;transition:none}
html.mo .editorial-site .sec-head.mo-pre.mo-in::after{transform:scaleX(1);transition:transform .8s cubic-bezier(.16,1,.3,1) .1s}
/* phone hero: a short opening sequence on load, runs once */
@media (max-width:768px) and (prefers-reduced-motion:no-preference){
  @keyframes moZoom{from{transform:scale(1.09)}to{transform:scale(1)}}
  @keyframes moRise{from{opacity:0;transform:translate3d(0,28px,0)}to{opacity:1;transform:none}}
  @keyframes moFade{from{opacity:0}to{opacity:1}}
  .editorial-site .editorial-cover .cover-portrait img{animation:moZoom 1.8s cubic-bezier(.16,1,.3,1) both}
  .editorial-site .editorial-cover .hero-kicker{animation:moFade .9s ease .5s both}
  .editorial-site .editorial-cover .h-line:nth-child(1)>span{display:inline-block;animation:moRise 1s cubic-bezier(.16,1,.3,1) .25s both}
  .editorial-site .editorial-cover .h-line:nth-child(2)>span{display:inline-block;animation:moRise 1s cubic-bezier(.16,1,.3,1) .42s both}
  .editorial-site .editorial-cover .cover-statement{animation:moRise .9s cubic-bezier(.16,1,.3,1) .7s both}
  .editorial-site .editorial-cover .hero-tag{animation:moRise .9s cubic-bezier(.16,1,.3,1) .82s both}
  .editorial-site .editorial-cover .hero-cta{animation:moRise .9s cubic-bezier(.16,1,.3,1) .94s both}
  .editorial-site .editorial-cover .status-badge{animation:moFade .9s ease 1.15s both}
}

/* ---------- page length ---------- */
/* desktop: narrower spreads + a shorter pin, so the horizontal run costs ~2 screens instead of ~4 */
@media (min-width:1001px){.editorial-site .panel{width:58vw;max-width:820px}}
.proj-swipe{display:none}
@media (max-width:768px){
  /* phone: projects become a swipeable row instead of five stacked cards */
  .proj-swipe{display:flex;justify-content:space-between;align-items:center;margin:-8px 0 14px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:#8f8a7f}
  .proj-swipe b{font-weight:400;color:var(--gold)}
  .editorial-site .proj-viewport,.editorial-site .proj-viewport.js-pin{overflow-x:auto;overflow-y:hidden;padding:0 20px 6px;scroll-snap-type:x mandatory;scroll-padding:0 20px;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none}
  .editorial-site .proj-viewport::-webkit-scrollbar{display:none}
  .editorial-site .proj-track{display:flex;grid-template-columns:none;gap:12px;width:max-content}
  .editorial-site .panel{width:calc(100vw - 64px);flex:0 0 auto;scroll-snap-align:start}
  /* experience: tighter cards, shorter screenshots */
  .editorial-site .work-card,.editorial-site .work-card.has-media,.editorial-site .work-stack.js-stack .work-card{padding:20px 18px;gap:10px}
  .editorial-site .wc-media{aspect-ratio:2/1}
  .editorial-site .wc-tags{margin-top:12px;gap:6px}
  .editorial-site .wc-tags li{font-size:10px;padding:3px 8px}
  .editorial-site .wc-desc{margin-bottom:0}
}
@media (max-width:768px){
  .editorial-site .proj-track{align-items:flex-start}
  .editorial-site .wc-media img[src*="emetal"]{object-position:50% 24%}
}
@media (max-width:768px){
  .editorial-site .p-media img{width:100%}
  .editorial-site .p-hint{padding-top:4px}
}

/* ---------- language switch + English edition ---------- */
.lang-switch{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:#cfc6b5;border:1px solid rgba(198,170,125,.35);padding:6px 10px;margin-left:22px;line-height:1;transition:color .25s,border-color .25s}
.lang-switch:hover{color:var(--gold,#c6aa7d);border-color:rgba(198,170,125,.8)}
.nav-links+.lang-switch{margin-left:22px}
@media (max-width:768px){
  .editorial-site .lang-switch{margin-left:auto;margin-right:10px;min-height:48px;min-width:48px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;font-size:12px}
}
/* serif headlines: Georgia carries the Latin text so it never falls back to SimSun */
.lang-en .cover-statement,.lang-en .profile-title,.lang-en .profile-focus .stat-n,.lang-en .story-heading h2,.lang-en .story-chapter h3,.lang-en .story-conversation>p,.lang-en .story-chapter>p.story-emphasis,.lang-en .story-pullquote p,.lang-en .story-next h4,.lang-en .story-finale>p,.lang-en .practice-copy h2,.lang-en .sec-head h2,.lang-en .skill-cat{font-family:Georgia,'Times New Roman',serif;letter-spacing:-.005em}
.lang-en .cover-statement{letter-spacing:0}
.lang-en .story-heading h2{line-height:1.15}
.lang-en .story-chapter h3{line-height:1.3}
.lang-en .profile-title{line-height:1.3}
.lang-en .about-p,.lang-en .story-chapter>p,.lang-en .wc-desc,.lang-en .p-desc,.lang-en .foot-note{line-height:1.8}
.lang-en .foot-big{line-height:1.2}
.lang-en .wc-main h3,.lang-en .p-name{letter-spacing:0}
.lang-en .story-heading h2{font-size:clamp(40px,4.6vw,66px)}
.lang-en .story-heading h2,.lang-en .story-chapter h3,.lang-en .profile-title,.lang-en .story-finale>p{text-wrap:balance}