/* An open journal: generous paper, a sculptural sea window and measured motion. */
:root { --paper:#f5f4ef; --gold:#9a8056; --serif:'Songti SC','STSong','Noto Serif SC',serif; --motion-ease:cubic-bezier(.22,1,.36,1); }
html[data-theme="night"] { --paper:#0b1b27; --gold:#c9b58b; }
body.georgefeng-site { background:var(--paper); }
html[data-theme] .home-hero { background:var(--paper); color:var(--ink); padding:26px 0 0; min-height:0; overflow:clip; }
.horizon-masthead { display:flex; justify-content:space-between; gap:20px; padding:0 0 18px; border-bottom:1px solid var(--line-strong); color:var(--ink-soft); font:10px var(--mono); letter-spacing:.13em; }
.home-hero__frame { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:7%; padding:42px 0 0; transform:none; }
.home-hero__main, html[lang^="en"] .home-hero__main { max-width:none; min-width:0; position:relative; z-index:2; }
html .home-hero__badge { margin-bottom:30px; font-size:11px; color:var(--ink-soft); animation:none; }
html .home-hero__title { color:var(--ink); font-size:clamp(90px,10.2vw,148px); margin-bottom:28px; animation:none; line-height:1.02; }
html[data-theme] .hero-swash { color:var(--gold); }
.horizon-thought { margin:0 0 25px; font-family:var(--serif); font-size:clamp(28px,3.2vw,43px); font-weight:400; letter-spacing:.08em; line-height:1.55; }
.horizon-thought>span { display:block; }
html[lang^="en"] .horizon-thought { font:400 clamp(25px,2.8vw,39px)/1.3 var(--display-serif); letter-spacing:-.015em; }
html .home-hero__sub { color:var(--ink-soft); font-size:14px; max-width:350px; line-height:1.9; animation:none; }
html .home-hero__foot { margin-top:30px; animation:none; }
html .home-hero .btn { border-radius:3px; padding:13px 22px; }
html .home-hero .btn--light { background:var(--ink); color:var(--paper); border-color:var(--ink); box-shadow:none; }
html .home-hero .btn--ghost-dark { color:var(--ink); border-color:var(--line-strong); background:transparent; }
.horizon-art { position:relative; width:100%; perspective:1400px; padding:0 14px; }
.horizon-window { position:relative; height:clamp(450px,calc(100svh - 260px),590px); border-radius:48% 48% 3px 3px; isolation:isolate; overflow:hidden; background:#bbd7de; box-shadow:0 25px 45px -22px #21435244,inset 0 0 0 1px #ffffff44; transform-origin:50% 90%; }
.horizon-window .sea-scene { z-index:0; background-position:65% center; }
html .horizon-window .sea-scene__veil { z-index:1; background:linear-gradient(0deg,#091e3e55,transparent 30%,transparent 80%,#ffffff0c); }
.horizon-window__label,.horizon-window__number { position:absolute; z-index:2; color:#f5faf7; bottom:25px; font:9px var(--mono); letter-spacing:.16em; }
.horizon-window__label { left:25px; }
.horizon-window__number { right:25px; }
.horizon-orbit { position:absolute; inset:-17px 0 48px; border:1px solid var(--line-strong); border-radius:48% 48% 2px 2px; pointer-events:none; }
.horizon-orbit>span { position:absolute; right:11%; top:4%; display:grid; place-items:center; width:57px; height:57px; background:var(--paper); border-radius:50%; color:var(--gold); font:55px/1 serif; }
.horizon-art__caption { display:flex; justify-content:space-between; gap:12px; padding-top:19px; color:var(--ink-soft); font:10px var(--mono); letter-spacing:.07em; }
.home-hero__horizon { padding:28px 0 24px; border-bottom:1px solid var(--line-strong); }
.horizon-scroll { display:flex; align-items:center; gap:14px; font:10px var(--mono); letter-spacing:.13em; color:var(--ink-soft); }
.horizon-scroll>span { display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--line-strong); border-radius:50%; font:20px var(--sans); }
.home-hero__coordinate { display:none; }
.home-hero__tools { margin:0; }
html .sea-pause { color:var(--ink-soft); background:transparent; border-color:var(--line-strong); border-radius:3px; font-size:10px; }
html[data-theme="day"] body.home:not(.nav-open) .site-header:not(.is-scrolled) { background:var(--paper); }
.home-intro { position:relative; padding:100px 0 110px; display:grid; grid-template-columns:1fr 2.2fr; gap:8%; align-items:start; border-bottom:1px solid var(--line); }
.home-intro::before,.home-intro::after { content:none; }
.home-intro__label { font:11px var(--mono); letter-spacing:.08em; margin:12px 0; color:var(--ink-soft); }
.home-intro__label::before { content:'✧'; display:block; color:var(--gold); font:52px var(--serif); margin-bottom:23px; }
.home-intro__copy { margin:0; font:400 clamp(20px,2.25vw,29px)/1.95 var(--serif); letter-spacing:.015em; color:var(--ink); }
.ink-word { transition:color .25s; }
.latest-section { padding-top:80px; }
.section-heading { margin-bottom:40px; }
.section-heading .eyebrow::before { content:none; }
.section-heading h2 { font-size:clamp(32px,3.7vw,48px); }
.section-heading .eyebrow { font-size:10px; color:var(--gold); margin-bottom:12px; }
html[data-theme] .post-card, html[data-theme] .post-card__body { background:transparent; box-shadow:none; border:0; border-radius:0; }
.post-card::after { content:none; }
.post-card__visual { border-radius:3px; overflow:hidden; }
.post-card__visual img { scale:1.09; translate:0 var(--image-drift,0px); }
.post-card__body { padding:24px 0 28px; border-bottom:1px solid var(--line); }
.post-card--featured { grid-template-columns:1.4fr 1fr; gap:5%; padding-bottom:36px; border-bottom:1px solid var(--line)!important; }
.post-card--featured .post-card__visual { aspect-ratio:1.45; min-height:0; align-self:center; border-radius:3px; }
.post-card--featured .post-card__body { padding:24px 0; border:0; }
.post-card--featured .post-card__title { font-size:clamp(28px,3.1vw,40px); }
.post-card__read { margin-top:22px; }
.post-card__read i { background:transparent; color:var(--ink); border:1px solid var(--line-strong); }
.post-grid { gap:36px; }
.principles-section { display:grid; grid-template-columns:1fr 1.75fr; gap:10%; padding-top:70px; padding-bottom:100px; align-items:start; }
.principles-section>.section-heading { position:sticky; top:140px; display:block; }
.principles-section .section-heading__index { display:block; margin-top:28px; color:var(--gold); }
.principle-list { display:block; }
html .principle:nth-child(n) { --stack:0; position:sticky; top:calc(115px + var(--stack)*26px); min-height:245px; padding:34px 36px 34px 128px; margin-bottom:28px; border-radius:4px; background:#e8efed; border:1px solid #c4d3d0; box-shadow:0 -12px 30px #20353b05; }
html .principle:nth-child(2) { --stack:1; background:#edf0e8; }
html .principle:nth-child(3) { --stack:2; background:#e6ecf0; }
html .principle:nth-child(4) { --stack:3; background:#f2eee5; }
html .principle:nth-child(n) .principle__index { position:absolute; left:27px; top:28px; margin:0; font:italic 500 77px var(--display-serif); color:#7e9b9a; }
.principle__name { padding-top:10px; font-size:24px; }
.principle__text { font-size:14px; }
.principle::after { content:none; }
html[data-theme="night"] .principle:nth-child(n) { background:#122d3b; border-color:#3d5961; }
html[data-theme="night"] .principle:nth-child(2n) { background:#193440; }
html[data-theme="night"] .principle .principle__index { color:#7c9eac; }
.about-strip { position:relative; overflow:hidden; padding:100px 0; background:#e5ebe8; }
.about-strip::before { content:'✧'; position:absolute; width:400px; height:400px; inset:auto -90px -170px auto; color:var(--gold); opacity:.17; font:500px/1 var(--serif); transform:rotate(15deg); }
.about-strip::after { content:none; }
.about-strip__heading h2 { font-family:var(--serif); font-size:clamp(27px,3.1vw,43px); }
.topic-row { border-radius:0; background:transparent; padding-block:28px; border-bottom:1px solid var(--line); }
html[data-theme="night"] .topic-row { background:transparent; }
.topic-row__name { transition:transform .6s var(--motion-ease); }
.topic-row:hover .topic-row__name { transform:translateX(14px); }
.article-visual { border-radius:3px; overflow:hidden; }
.article-visual img { scale:1.06; translate:0 var(--image-drift,0px); }
.article-header__title { font-family:var(--serif); }
.archive-hero,.standard-page .page-header { padding-top:35px; padding-bottom:50px; border-bottom:1px solid var(--line-strong); }
html[data-theme] .archive-hero::before,html[data-theme] .standard-page .page-header::before { background:transparent; }
html[data-theme] .archive-hero,html[data-theme] .archive-hero h1,html[data-theme] .standard-page .page-header,html[data-theme] .standard-page .page-header h1 { color:var(--ink); }
.archive-hero::after,.standard-page .page-header::after { content:'✧'; position:absolute; right:0; top:25px; color:var(--gold); font:70px/1 serif; opacity:.6; pointer-events:none; }
.archive-hero h1,.standard-page .page-header h1 { padding-right:80px; }
.post-card__visual img[src*="hatter-moment-screenshot"],.article-visual img[src*="hatter-moment-screenshot"] { scale:1; translate:none; }
.site-footer { margin-top:55px; }
.site-footer__inner { padding-top:65px; }

/* Salient-style split text and clip reveals, driven by its bundled anime.js. */
.motion-mask { display:inline-block; overflow:clip; vertical-align:bottom; padding-bottom:.13em; margin-bottom:-.13em; }
.motion-word { display:inline-block; transform-origin:50% 100%; }
.motion-pending .motion-word { transform:translateY(110%) rotateZ(4deg); }
.motion-rise.motion-pending { opacity:0; transform:translateY(30px); }
.motion-media { position:relative; }
.motion-media::after { content:''; position:absolute; inset:0; z-index:3; background:var(--paper); transform:scaleY(0); transform-origin:50% 0; pointer-events:none; }
.motion-media.motion-pending::after { transform:scaleY(1); }
.motion-media.motion-revealing::after { animation:horizon-unveil 1s var(--motion-ease) both; }
@keyframes horizon-unveil { from { transform:scaleY(1); } to { transform:scaleY(0); } }
html.js .reveal { opacity:1; transform:none; transition:none; }
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  html.js .post-card.is-tilting, html .post-card:hover { transform:none; box-shadow:none; }
  html.js .principle.is-tilting, html .principle:hover { transform:none; }
  .btn span { transition:transform .4s var(--motion-ease); }
  .btn:hover span { transform:translate(3px,-3px); }
}
@media (prefers-reduced-motion:no-preference) {
  .horizon-scroll>span { animation:horizon-cue 2.6s ease-in-out infinite; }
  .horizon-orbit>span { animation:horizon-compass 18s ease-in-out infinite; }
  .sea-paused .horizon-orbit>span { animation-play-state:paused; }
}
@keyframes horizon-cue { 0%,100% { translate:0 0; } 50% { translate:0 6px; } }
@keyframes horizon-compass { 0%,100% { rotate:0deg; } 50% { rotate:90deg; } }
@media (max-width:1000px) and (min-width:861px) {
  .home-hero__frame { gap:4%; }
  html .home-hero__title { font-size:90px; }
  .horizon-window { height:490px; }
  .principles-section { gap:5%; }
  html .principle:nth-child(n) { padding-left:105px; }
}
@media (max-width:860px) {
  html .home-hero { padding-top:18px; }
  .horizon-masthead { font-size:8px; letter-spacing:.06em; }
  .horizon-masthead>span:last-child { display:none; }
  .home-hero__frame { grid-template-columns:1fr; gap:40px; padding-top:36px; }
  html .home-hero__badge { margin-bottom:22px; font-size:10px; }
  html .home-hero__title { font-size:clamp(80px,18vw,120px); margin-bottom:18px; }
  .horizon-thought { font-size:29px; margin-bottom:18px; }
  .horizon-thought>span { display:inline; }
  html[lang^="en"] .horizon-thought { font-size:30px; }
  html[lang^="en"] .horizon-thought>span { display:block; }
  html .home-hero__sub { font-size:13px; margin-bottom:0; }
  html .home-hero__foot { margin-top:22px; }
  .horizon-art { width:min(100%,560px); justify-self:center; padding-inline:10px; }
  .horizon-window { height:420px; border-radius:47% 47% 3px 3px; }
  .horizon-orbit { inset:-12px 0 43px; }
  .horizon-orbit>span { width:45px; height:45px; font-size:44px; }
  .horizon-art__caption { font-size:9px; }
  .home-hero__horizon { padding-top:22px; }
  .home-intro { padding-block:55px; grid-template-columns:1fr; gap:22px; }
  .home-intro__label::before { display:inline; font-size:26px; margin-right:16px; }
  .home-intro__copy { font-size:21px; line-height:1.9; }
  .latest-section { padding-top:55px; }
  .post-card--featured { grid-template-columns:1fr; gap:0; }
  .post-card--featured .post-card__visual { aspect-ratio:1.5; }
  .post-grid { gap:25px; }
  .principles-section { display:block; padding-block:45px 60px; }
  .principles-section>.section-heading { position:static; }
  .principles-section .section-heading__index { display:none; }
  html .principle:nth-child(n) { top:calc(82px + var(--stack)*16px); min-height:220px; padding:25px 24px 25px 94px; }
  html .principle:nth-child(n) .principle__index { left:20px; top:24px; font-size:62px; }
  .principle__name { font-size:22px; }
  .principle__text { font-size:13px; }
  .about-strip { padding-block:60px; }
  .topic-row { padding-block:24px; }
}
@media (prefers-reduced-motion:reduce) {
  .motion-pending .motion-word { transform:none; }
  .motion-media::after { display:none; }
  .motion-mask { overflow:visible; }
  .horizon-window,.home-hero__main { transform:none!important; opacity:1!important; }
  .post-card__visual img,.article-visual img { scale:1; translate:none; }
  .ink-word { color:inherit!important; }
  .ink-word { opacity:1!important; }
  .motion-rise.motion-pending { opacity:1; transform:none; }
  .principles-section>.section-heading,html .principle:nth-child(n) { position:relative; top:auto; }
  .horizon-scroll>span,.horizon-orbit>span { animation:none; }
}
