.page-my-way{
  --way-paper:#f0ede3;
  --way-paper-deep:#e5dfd2;
  --way-ink:#171816;
  --way-muted:#6c6d66;
  --way-cinnabar:#913b32;
  --way-moss:#4f5f52;
  --way-line:rgba(23,24,22,.16);
  background:var(--way-paper);
}

[data-theme="dark"] .page-my-way{
  --way-paper:#121510;
  --way-paper-deep:#1a1f18;
  --way-ink:#ebe7dc;
  --way-muted:#aaa99f;
  --way-cinnabar:#c36a5d;
  --way-moss:#93a08d;
  --way-line:rgba(235,231,220,.15);
}

.page-my-way #main-content{padding-top:72px;background:var(--way-paper);color:var(--way-ink)}
.way-page{overflow:clip;font-family:'Source Han Serif SC VF','Songti SC','Noto Serif CJK SC',serif;text-rendering:optimizeLegibility}
.way-page::selection{background:color-mix(in srgb,var(--way-cinnabar) 24%,transparent)}

.way-hero{position:relative;display:grid;min-height:min(78svh,820px);overflow:hidden;background:linear-gradient(112deg,#ece8dc 0%,#f4f1e8 58%,#e7e1d4 100%);color:#171816;isolation:isolate}
.way-hero::before{position:absolute;inset:0;z-index:-2;content:"";background-image:linear-gradient(90deg,transparent calc(50% - .5px),rgba(23,24,22,.06) 50%,transparent calc(50% + .5px)),radial-gradient(circle at 16% 24%,rgba(145,59,50,.07),transparent 24%)}
.way-hero::after{position:absolute;inset:clamp(18px,2.8vw,42px);z-index:-1;border:1px solid rgba(23,24,22,.1);content:"";pointer-events:none}
.way-hero__inner{position:relative;display:grid;width:min(1180px,calc(100% - clamp(48px,10vw,180px)));margin:auto;padding:clamp(72px,9vw,118px) 0;grid-template-columns:minmax(0,7fr) minmax(280px,4fr);grid-template-rows:1fr auto;gap:clamp(46px,8vw,128px);align-items:end}
.way-hero__heading{align-self:center}
.way-seal{display:grid;width:46px;height:46px;margin-bottom:clamp(42px,6vw,72px);place-items:center;border:1px solid color-mix(in srgb,var(--way-cinnabar) 70%,transparent);color:var(--way-cinnabar);font-size:21px;font-weight:700;line-height:1;transform:rotate(-2deg)}
.way-kicker{margin:0 0 17px;color:var(--way-moss);font-family:'Source Han Sans SC VF','Noto Sans SC','Microsoft YaHei',sans-serif;font-size:11px;font-weight:700;letter-spacing:.28em}
.way-hero h1{margin:0;font-size:clamp(76px,10vw,146px);font-weight:760;line-height:.92;letter-spacing:.12em}
.way-hero__creed{align-self:center;padding:clamp(26px,4vw,46px) 0;border-block:1px solid rgba(23,24,22,.16)}
.way-hero__creed p{margin:0;font-size:clamp(25px,2.8vw,42px);font-weight:650;line-height:1.65;letter-spacing:.08em}
.way-hero__creed span{display:block;margin-top:28px;color:#66665f;font-family:'Source Han Sans SC VF','Noto Sans SC','Microsoft YaHei',sans-serif;font-size:13px;line-height:1.8;letter-spacing:.08em}
.way-read{grid-column:1/-1;justify-self:center;display:inline-flex;align-items:center;gap:10px;color:#5f615b;font-family:'Source Han Sans SC VF','Noto Sans SC','Microsoft YaHei',sans-serif;font-size:11px;font-weight:700;letter-spacing:.2em;text-decoration:none}
.way-read svg{transition:transform .22s ease}.way-read:hover svg{transform:translateY(4px)}
.way-ink-path{position:absolute;right:-4%;bottom:-8%;width:min(72vw,1040px);height:88%;opacity:.25;pointer-events:none}
.way-ink-path path{fill:none;stroke:var(--way-cinnabar);stroke-width:1.2;stroke-linecap:round;stroke-dasharray:1600;stroke-dashoffset:1600;animation:wayInkTrace 1.9s .35s cubic-bezier(.2,.7,.2,1) forwards}

.way-essay{position:relative;display:grid;grid-template-columns:minmax(72px,1fr) minmax(0,760px) minmax(72px,1fr);padding:clamp(92px,11vw,164px) clamp(24px,4vw,68px) clamp(112px,13vw,190px);background:var(--way-paper)}
.way-margin{grid-column:1;justify-self:end;display:flex;width:68px;margin-right:clamp(34px,6vw,96px);flex-direction:column;align-items:center;gap:18px;color:var(--way-cinnabar)}
.way-margin span{font-size:15px;font-weight:700;letter-spacing:.18em;writing-mode:vertical-rl}
.way-margin i{display:block;width:1px;height:126px;background:linear-gradient(var(--way-cinnabar),transparent)}
.way-prose{grid-column:2;min-width:0;font-size:clamp(18px,1.28vw,21px);font-weight:470;line-height:2.08;letter-spacing:.035em}
.way-prose strong{color:var(--way-ink);font-weight:720}
.way-section{margin:0 0 clamp(58px,7vw,88px)}
.way-section p{margin:0 0 1.55em}.way-section p:last-child{margin-bottom:0}
.way-opening{font-size:clamp(24px,2.25vw,32px);font-weight:520;line-height:1.9;letter-spacing:.045em}
.way-opening::first-letter{float:left;margin:.16em .18em 0 0;color:var(--way-cinnabar);font-size:2.5em;font-weight:760;line-height:.78}
.way-trial{position:relative;margin:clamp(70px,9vw,116px) 0;padding:clamp(38px,5vw,58px) clamp(22px,4vw,52px);overflow:hidden;border-block:1px solid var(--way-line);text-align:center}
.way-trial>span{position:absolute;top:50%;left:50%;color:color-mix(in srgb,var(--way-cinnabar) 9%,transparent);font-size:clamp(160px,24vw,300px);font-weight:800;line-height:1;transform:translate(-50%,-50%)}
.way-trial p{position:relative;margin:0;font-size:clamp(32px,4.2vw,54px);font-weight:690;line-height:1.55;letter-spacing:.1em}
.way-pair{display:grid;margin-top:clamp(42px,6vw,68px);grid-template-columns:1fr 1fr;border-block:1px solid var(--way-line)}
.way-pair p{display:grid;min-height:180px;margin:0!important;padding:30px clamp(22px,4vw,42px);align-content:center;font-size:clamp(20px,1.8vw,25px);line-height:1.75}
.way-pair p+p{border-left:1px solid var(--way-line)}
.way-pair small{display:block;margin-bottom:10px;color:var(--way-cinnabar);font-family:'Source Han Sans SC VF','Noto Sans SC','Microsoft YaHei',sans-serif;font-size:10px;font-weight:750;letter-spacing:.2em}
.way-manifesto{position:relative;margin:clamp(86px,11vw,132px) calc(clamp(28px,5vw,74px) * -1);padding:clamp(48px,7vw,78px) clamp(28px,5vw,74px);background:var(--way-ink);color:var(--way-paper)}
.way-manifesto::before{position:absolute;top:18px;right:18px;width:9px;height:9px;background:var(--way-cinnabar);content:"";transform:rotate(45deg)}
.way-manifesto p{margin:0;color:inherit}.way-manifesto strong{color:inherit}
.way-manifesto__label{margin-bottom:22px!important;color:color-mix(in srgb,var(--way-paper) 62%,transparent)!important;font-family:'Source Han Sans SC VF','Noto Sans SC','Microsoft YaHei',sans-serif;font-size:12px;font-weight:700;letter-spacing:.14em}
.way-manifesto p:last-child{font-size:clamp(24px,2.65vw,38px);font-weight:650;line-height:1.75;letter-spacing:.045em}
.way-ending{margin:clamp(88px,11vw,138px) 0;padding:clamp(42px,6vw,64px) 0;border-block:1px solid var(--way-line)}
.way-ending p{margin:0;text-align:center;font-size:clamp(25px,3vw,40px);line-height:1.8;letter-spacing:.08em}.way-ending p+p{margin-top:9px}
.way-source{margin-top:clamp(76px,9vw,112px);padding:30px 0 0;border-top:1px solid var(--way-line);color:var(--way-muted);font-family:'Source Han Sans SC VF','Noto Sans SC','Microsoft YaHei',sans-serif;font-size:13px;line-height:1.9;letter-spacing:.02em}
.way-source p{margin:0 0 1em}.way-source p:last-child{margin-bottom:0}
.way-source__label{color:var(--way-cinnabar);font-size:10px;font-weight:750;letter-spacing:.2em}

.way-page.is-motion-ready [data-way-reveal]{opacity:0;transform:translateY(26px)}
.way-page.is-motion-ready [data-way-reveal].is-visible{opacity:1;transform:none;transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
@keyframes wayInkTrace{to{stroke-dashoffset:0}}

[data-theme="dark"] .way-hero{background:linear-gradient(112deg,#171b15 0%,#11140f 58%,#1c211a 100%);color:#ebe7dc}
[data-theme="dark"] .way-hero::before{background-image:linear-gradient(90deg,transparent calc(50% - .5px),rgba(235,231,220,.05) 50%,transparent calc(50% + .5px)),radial-gradient(circle at 16% 24%,rgba(195,106,93,.08),transparent 24%)}
[data-theme="dark"] .way-hero::after{border-color:rgba(235,231,220,.09)}
[data-theme="dark"] .way-hero__creed{border-color:rgba(235,231,220,.16)}
[data-theme="dark"] .way-hero__creed span,[data-theme="dark"] .way-read{color:#aaa99f}

@media(max-width:860px){
  .page-my-way #main-content{padding-top:calc(64px + env(safe-area-inset-top))}
  .way-hero{min-height:auto}
  .way-hero__inner{width:calc(100% - 48px);padding:82px 0 62px;grid-template-columns:1fr;grid-template-rows:auto;gap:54px}
  .way-seal{width:40px;height:40px;margin-bottom:44px;font-size:18px}
  .way-hero h1{font-size:clamp(64px,18vw,92px);letter-spacing:.08em}
  .way-hero__creed{padding-block:28px}
  .way-hero__creed p{font-size:clamp(24px,6vw,33px);line-height:1.7;letter-spacing:.055em}
  .way-hero__creed span{margin-top:20px;font-size:12px;line-height:1.8}
  .way-read{justify-self:start}
  .way-ink-path{right:-38%;bottom:-4%;width:130vw;height:70%;opacity:.2}
}

@media(max-width:640px){
  .way-hero::after{inset:12px}
  .way-hero__inner{width:calc(100% - 40px);padding:64px 0 52px;gap:42px}
  .way-kicker{font-size:10px;letter-spacing:.22em}
  .way-hero h1{font-size:clamp(58px,18vw,76px);line-height:1;letter-spacing:.06em}
  .way-hero__creed p{font-size:clamp(22px,6.4vw,28px);line-height:1.72;letter-spacing:.045em}
  .way-essay{display:block;padding:72px 22px 104px}
  .way-margin{display:none}
  .way-prose{font-size:16.5px;line-height:2;letter-spacing:.025em}
  .way-section{margin-bottom:58px}
  .way-opening{font-size:21px;line-height:1.85;letter-spacing:.025em}
  .way-trial{margin:66px 0;padding:38px 4px}
  .way-trial p{font-size:clamp(28px,8.6vw,38px);line-height:1.6;letter-spacing:.06em}
  .way-trial>span{font-size:180px}
  .way-pair{grid-template-columns:1fr}
  .way-pair p{min-height:0;padding:25px 6px;font-size:19px;line-height:1.75}
  .way-pair p+p{border-top:1px solid var(--way-line);border-left:0}
  .way-manifesto{margin:72px -22px;padding:44px 22px}
  .way-manifesto p:last-child{font-size:22px;line-height:1.75;letter-spacing:.025em}
  .way-ending{margin:72px 0;padding:35px 0}
  .way-ending p{font-size:clamp(21px,6.2vw,27px);line-height:1.8;letter-spacing:.04em;text-align:left}
  .way-source{font-size:12.5px}
}

@media(prefers-reduced-motion:reduce){
  .way-ink-path path{animation:none;stroke-dashoffset:0}
  .way-read svg{transition:none}
  .way-page.is-motion-ready [data-way-reveal]{opacity:1;transform:none}
  .way-page.is-motion-ready [data-way-reveal].is-visible{transition:none}
}