:root {
  color-scheme: light;
  --ink: #12383b;
  --ink-2: #31585a;
  --muted: #6a7975;
  --jade: #176b67;
  --gold: #d7ae54;
  --gold-light: #f5df9b;
  --canvas: #edf1e9;
  --line: rgba(163, 150, 113, .32);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 10% 14%, rgba(208, 181, 103, .2), transparent 30rem),
    radial-gradient(circle at 90% 46%, rgba(79, 169, 158, .12), transparent 34rem),
    linear-gradient(180deg, #f6f2e7 0%, var(--canvas) 62%, #e8eee7 100%);
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;
  line-height: 1.75;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .24;
  background-image: url("data:image/svg+xml,%3Csvg width='120' height='120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}

.sky { position: fixed; inset: 0; z-index: -1; pointer-events: none; }
.sky i { position: absolute; display: block; width: 4px; height: 4px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 18px 5px rgba(215,174,84,.35); animation: drift 8s ease-in-out infinite; }
.sky i:nth-child(1) { left: 8%; top: 22%; }
.sky i:nth-child(2) { right: 11%; top: 58%; animation-delay: -3s; }
.sky i:nth-child(3) { left: 64%; top: 10%; animation-delay: -5s; }
@keyframes drift { 0%,100% { transform: translateY(0) scale(.75); opacity: .25; } 50% { transform: translateY(-18px) scale(1.2); opacity: .9; } }

main { width: min(1120px, calc(100% - 36px)); margin: 0 auto; padding: 18px 0 56px; }
.topbar { display: flex; align-items: center; justify-content: space-between; min-height: 64px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); font-family: "Songti SC", STSong, serif; font-size: 17px; font-weight: 800; letter-spacing: .08em; text-decoration: none; }
.brand img { width: 34px; height: 34px; }
.nav-links { display: flex; align-items: center; gap: 26px; }
.nav-links a { color: var(--ink-2); font-size: 14px; font-weight: 650; text-decoration: none; }
.nav-links a:hover { color: var(--jade); }

.hero { position: relative; min-height: 620px; display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: 30px; overflow: hidden; padding: clamp(36px, 7vw, 78px); border: 1px solid rgba(232,202,119,.48); border-radius: 38px; background: radial-gradient(circle at 79% 47%, rgba(112,211,197,.18), transparent 22rem), linear-gradient(145deg, #0d3a3c 0%, #092c34 58%, #102836 100%); box-shadow: 0 32px 80px rgba(14,47,48,.2); color: #fff8e6; }
.hero::before { content:""; position:absolute; inset:22px; border:1px solid rgba(231,202,119,.22); border-radius:26px; pointer-events:none; }
.hero::after { content:""; position:absolute; width:560px; height:560px; right:-160px; top:-280px; border:1px solid rgba(245,223,155,.35); border-radius:50%; box-shadow:0 0 110px rgba(215,174,84,.14), inset 0 0 70px rgba(141,215,210,.08); }
.hero-copy { position: relative; z-index: 2; }
.kicker { margin: 0 0 13px; color: var(--gold-light); font-size: 12px; font-weight: 850; letter-spacing: .18em; }
.kicker.dark { color: var(--jade); }
h1,h2,h3,p { margin-top: 0; }
h1,h2,h3 { font-family: "Songti SC", STSong, "Noto Serif CJK SC", serif; }
.hero h1 { margin-bottom: 22px; font-size: clamp(56px, 8vw, 98px); line-height: .95; letter-spacing: .08em; text-shadow: 0 5px 30px rgba(245,223,155,.16); }
.hero h1 span { display:block; }
.hero h1 small { display:block; margin-top:20px; color:var(--gold-light); font-size:.3em; font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; letter-spacing:.36em; }
.lead { max-width: 600px; margin-bottom: 28px; color: #d5e4df; font-size: clamp(17px, 2vw, 20px); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.button { display:inline-flex; min-height:48px; align-items:center; justify-content:center; padding:10px 22px; border:1px solid rgba(215,174,84,.45); border-radius:999px; color:var(--ink); font-weight:800; text-decoration:none; transition:transform .2s ease,box-shadow .2s ease,background .2s ease; }
.button:hover { transform:translateY(-2px); }
.button.primary { background:linear-gradient(135deg,var(--gold-light),var(--gold)); box-shadow:0 12px 28px rgba(215,174,84,.2); }
.button.ghost { color:#f7f0dc; border-color:rgba(247,240,220,.34); background:rgba(255,255,255,.06); }
.button.light { color:#fff5da; border-color:rgba(245,223,155,.45); background:rgba(255,255,255,.08); }
.promise { margin: 18px 0 0; color: #9fc1ba; font-size: 13px; }

.codex { position:relative; z-index:2; min-height:380px; perspective:900px; }
.orbit { position:absolute; left:50%; top:50%; border:1px solid rgba(245,223,155,.4); border-radius:50%; transform:translate(-50%,-50%); animation:spin 24s linear infinite; }
.orbit::before,.orbit::after { content:""; position:absolute; width:9px; height:9px; border-radius:50%; background:var(--gold-light); box-shadow:0 0 20px var(--gold); }
.orbit::before { top:11%; left:17%; }
.orbit::after { bottom:5%; right:24%; }
.orbit-one { width:360px; height:360px; }
.orbit-two { width:280px; height:280px; animation-direction:reverse; animation-duration:18s; }
@keyframes spin { to { transform:translate(-50%,-50%) rotate(360deg); } }
.scroll { position:absolute; width:174px; height:300px; padding:28px 18px; border:1px solid rgba(245,223,155,.7); border-radius:18px 18px 28px 28px; background:linear-gradient(165deg,rgba(28,74,75,.96),rgba(7,38,47,.98)); box-shadow:0 28px 50px rgba(0,0,0,.3),inset 0 0 34px rgba(141,215,210,.08); text-align:center; transition:transform .4s ease; }
.scroll::before { content:""; position:absolute; inset:9px; border:1px solid rgba(215,174,84,.27); border-radius:12px 12px 21px 21px; }
.scroll b,.scroll span,.scroll em { position:relative; z-index:1; display:block; }
.scroll b { color:var(--gold-light); font-size:12px; letter-spacing:.16em; }
.scroll span { margin-top:56px; color:#fff7df; font:700 48px/1 "Songti SC",STSong,serif; }
.scroll em { margin-top:76px; color:#8fd0c8; font-size:11px; font-style:normal; letter-spacing:.12em; }
.scroll-back { left:52%; top:50%; transform:translate(-5%,-50%) rotate(8deg) scale(.86); opacity:.65; }
.scroll-mid { left:35%; top:50%; transform:translate(-20%,-50%) rotate(-5deg) scale(.93); opacity:.84; }
.scroll-front { left:9%; top:50%; transform:translate(0,-50%) rotate(-1deg); }
.codex:hover .scroll-front { transform:translate(-8px,-58%) rotate(-3deg); }

.section { margin-top:22px; padding:clamp(28px,6vw,62px); border:1px solid var(--line); border-radius:30px; background:rgba(255,251,241,.82); box-shadow:0 16px 44px rgba(46,62,53,.07); backdrop-filter:blur(18px); }
.section h2 { margin-bottom:18px; font-size:clamp(32px,5vw,54px); line-height:1.18; letter-spacing:.02em; }
.section p { color:var(--muted); }
.intro>p:not(.kicker) { max-width:720px; font-size:17px; }
.path-grid,.volume-grid,.support-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:34px; }
.path-grid article,.support-grid article { padding:24px; border:1px solid var(--line); border-radius:20px; background:rgba(255,255,255,.54); }
.path-grid span { color:var(--gold); font-size:12px; font-weight:900; letter-spacing:.15em; }
.path-grid h3,.support-grid h3 { margin:12px 0 7px; font-size:22px; }
.path-grid p,.support-grid p { margin:0; font-size:14px; }
.section-title { display:flex; align-items:end; justify-content:space-between; gap:30px; }
.section-title h2 { margin-bottom:0; }
.section-title>p { max-width:320px; margin-bottom:4px; text-align:right; }
.volume-card { position:relative; overflow:hidden; min-height:320px; padding:26px; border-radius:24px; color:#fff5de; box-shadow:0 18px 38px rgba(15,52,52,.16); }
.volume-card::after { content:""; position:absolute; width:220px; height:220px; right:-90px; top:-95px; border:1px solid rgba(255,255,255,.22); border-radius:50%; box-shadow:0 0 44px rgba(255,255,255,.08); }
.volume-card>span { color:var(--gold-light); font-size:12px; font-weight:800; letter-spacing:.15em; }
.volume-card .sigil { display:grid; width:100px; height:100px; place-items:center; margin:38px auto 28px; border:1px solid rgba(245,223,155,.66); border-radius:50%; color:var(--gold-light); font:700 46px/1 "Songti SC",STSong,serif; box-shadow:0 0 0 9px rgba(245,223,155,.07),0 0 40px rgba(245,223,155,.12); }
.volume-card h3 { margin:0 0 4px; font-size:28px; }
.volume-card p { margin:0; color:rgba(255,255,255,.7); font-size:14px; }
.observe { background:linear-gradient(150deg,#236973,#092f3a); }
.heart { background:linear-gradient(150deg,#315f58,#173a3f); }
.change { background:linear-gradient(150deg,#416777,#1c3745); }
.feature-band { display:flex; align-items:center; justify-content:space-between; gap:40px; background:radial-gradient(circle at 80% 20%,rgba(215,174,84,.18),transparent 22rem),linear-gradient(135deg,#0b3e40,#082b32); color:#fff8e6; }
.feature-band>div { max-width:700px; }
.feature-band h2 { margin-bottom:12px; }
.feature-band p:not(.kicker) { margin:0; color:#bad1cb; }
.mini-icon { display:grid; width:44px; height:44px; place-items:center; border:1px solid rgba(215,174,84,.55); border-radius:50%; color:var(--jade); font:700 19px/1 "Songti SC",STSong,serif; background:#fff8e9; box-shadow:0 0 0 5px rgba(215,174,84,.08); }
.contact-card { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:18px; padding:28px; border:1px solid rgba(215,174,84,.4); border-radius:22px; background:linear-gradient(135deg,rgba(228,205,144,.22),rgba(126,198,187,.14)); }
.contact-card h3 { margin:0 0 6px; font-size:25px; }
.contact-card p { margin:0; }
footer { display:flex; align-items:center; gap:14px; padding:38px 8px 0; color:#667975; font-size:13px; }
footer img { width:38px;height:38px; }
footer p { margin:0; flex:1; }
footer div { display:flex;gap:18px; }
footer a { color:var(--jade);text-decoration:none; }

.legal-hero { overflow:hidden; position:relative; padding:clamp(36px,7vw,72px); border:1px solid rgba(232,202,119,.48); border-radius:32px; background:radial-gradient(circle at 82% 12%,rgba(141,215,210,.19),transparent 22rem),linear-gradient(145deg,#0d3a3c,#092c34); box-shadow:0 26px 70px rgba(14,47,48,.18); color:#fff8e6; }
.legal-hero::after { content:""; position:absolute;width:360px;height:360px;right:-100px;top:-220px;border:1px solid rgba(245,223,155,.35);border-radius:50%;box-shadow:0 0 80px rgba(215,174,84,.14); }
.legal-hero h1 { margin:0 0 18px;font-size:clamp(44px,7vw,72px);line-height:1.08; }
.legal-hero .date { margin:20px 0 0;color:#9fc1ba;font-size:13px; }
.legal-layout { display:grid;grid-template-columns:210px 1fr;gap:22px;margin-top:22px;align-items:start; }
.legal-layout aside { position:sticky;top:20px;display:flex;flex-direction:column;gap:9px;padding:22px;border:1px solid var(--line);border-radius:20px;background:rgba(255,251,241,.82); }
.legal-layout aside strong { margin-bottom:5px;font-family:"Songti SC",STSong,serif; }
.legal-layout aside a { color:var(--muted);font-size:14px;text-decoration:none; }
.legal-layout aside a:hover { color:var(--jade); }
.legal-copy { display:flex;flex-direction:column;gap:14px; }
.legal-copy section { scroll-margin-top:20px;padding:clamp(22px,4vw,34px);border:1px solid var(--line);border-radius:22px;background:rgba(255,251,241,.86);box-shadow:0 12px 32px rgba(46,62,53,.06); }
.legal-copy section>span { color:var(--gold);font-size:12px;font-weight:900;letter-spacing:.16em; }
.legal-copy h2 { margin:6px 0 10px;font-size:25px; }
.legal-copy p { margin:0;color:var(--muted); }
.legal-copy p+p { margin-top:10px; }
.legal-copy a { color:var(--jade);font-weight:700; }

@media (max-width: 840px) {
  .hero { min-height:auto;grid-template-columns:1fr;padding-bottom:30px; }
  .codex { min-height:330px;max-width:520px;width:100%;margin:0 auto; }
  .path-grid,.volume-grid,.support-grid { grid-template-columns:1fr; }
  .volume-card { min-height:240px; }
  .volume-card .sigil { margin:22px auto; }
  .section-title,.feature-band,.contact-card { align-items:flex-start;flex-direction:column; }
  .section-title>p { max-width:unset;text-align:left; }
  .legal-layout { grid-template-columns:1fr; }
  .legal-layout aside { position:static;display:none; }
}
@media (max-width: 560px) {
  main { width:min(100% - 22px,1120px);padding-top:8px; }
  .topbar { min-height:58px; }
  .nav-links a:not(:last-child) { display:none; }
  .hero,.section,.legal-hero { border-radius:24px; }
  .hero { padding:38px 25px 26px; }
  .hero::before { inset:10px;border-radius:17px; }
  .hero h1 { font-size:54px; }
  .codex { min-height:300px;transform:scale(.88);margin:-20px auto; }
  .scroll { width:150px;height:266px; }
  .scroll span { margin-top:48px;font-size:41px; }
  .scroll em { margin-top:61px; }
  .orbit-one { width:310px;height:310px; }
  .orbit-two { width:240px;height:240px; }
  .section { padding:28px 22px; }
  .section h2 { font-size:34px; }
  .contact-card .button,.feature-band .button { width:100%; }
  .contact-card .button { font-size:13px; }
  footer { align-items:flex-start;flex-wrap:wrap; }
  footer p { flex-basis:calc(100% - 56px); }
  footer div { width:100%;padding-left:52px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; }.sky i,.orbit { animation:none; }.button,.scroll { transition:none; } }