:root{
  --serif-ko:'Nanum Myeongjo',serif;
  --serif-body:'Noto Serif KR',serif;
  --serif-en:'Cormorant Garamond',serif;
  --gold:#c8a45a; --gold-dim:#8a7038;
  --ju:#9e2b25; --ju-soft:#b94842; /* 朱 선불교 붉은색 */
}
/* ===== 다크 ===== */
[data-theme="dark"]{
  --bg:#0a0a0c; --bg2:#16161a;
  --fg:#f4f1ea; --fg-dim:#b8b2a4; --fg-faint:#6a665d;
  --line:rgba(200,164,90,.16);
  --card:rgba(255,255,255,.015);
  --mist1:rgba(200,164,90,.05); --mist2:rgba(120,120,130,.04);
  --ring-bg:rgba(244,241,234,.10);
}
/* ===== 라이트 ===== */
[data-theme="light"]{
  --bg:#f4f1ea; --bg2:#ece7db;
  --fg:#1a1815; --fg-dim:#5a554c; --fg-faint:#a39d8f;
  --line:rgba(158,43,37,.18);
  --card:rgba(0,0,0,.015);
  --mist1:rgba(158,43,37,.05); --mist2:rgba(160,150,130,.06);
  --ring-bg:rgba(26,24,21,.10);
  --gold-dim:#9a7d3c;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--fg);font-family:var(--serif-body);
  font-weight:300;line-height:1.9;overflow-x:hidden;transition:background .8s,color .8s}

#ink-mist{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.9}
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.035;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* 네비 */
nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;
  align-items:center;padding:24px 6vw;transition:.5s}
nav.scrolled{background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(12px);
  padding:15px 6vw;border-bottom:1px solid var(--line)}
.brand{font-family:var(--serif-ko);font-weight:800;font-size:1.05rem;letter-spacing:.3em;display:flex;align-items:center;gap:.7em}
.brand .han{color:var(--ju-soft);font-size:1.25rem;letter-spacing:.1em}
.menu{display:flex;gap:40px;list-style:none;align-items:center}
.menu a{color:var(--fg-dim);text-decoration:none;font-size:.8rem;letter-spacing:.2em;transition:.4s;position:relative}
.menu a:hover{color:var(--gold)}
.menu a::after{content:'';position:absolute;left:0;bottom:-6px;width:0;height:1px;background:var(--gold);transition:.4s}
.menu a:hover::after{width:100%}
.theme-toggle{background:none;border:1px solid var(--line);color:var(--fg-dim);cursor:pointer;
  width:38px;height:38px;border-radius:50%;font-size:.95rem;transition:.4s;display:grid;place-items:center}
.theme-toggle:hover{border-color:var(--gold);color:var(--gold);transform:rotate(20deg)}
.menu-toggle{display:none;background:none;border:none;color:var(--fg);font-size:1.4rem;cursor:pointer}

/* 히어로 */
.hero{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;padding:0 24px}
.breath-wrap{position:relative;width:340px;height:340px;display:grid;place-items:center;margin-bottom:10px}
.breath-ring{position:absolute;border-radius:50%;border:1px solid var(--ring-bg)}
.br1{width:340px;height:340px;animation:breathe 8s ease-in-out infinite}
.br2{width:240px;height:240px;animation:breathe 8s ease-in-out infinite .3s}
.br-core{position:absolute;width:150px;height:150px;border-radius:50%;border:1.5px solid var(--ju);
  animation:breathe 8s ease-in-out infinite;box-shadow:0 0 50px -8px var(--ju)}
@keyframes breathe{0%,100%{transform:scale(.82);opacity:.55}50%{transform:scale(1.06);opacity:1}}
.hero-han{position:relative;z-index:3;font-family:var(--serif-ko);font-weight:800;color:var(--fg);
  font-size:clamp(3rem,8vw,5.5rem);letter-spacing:.12em;line-height:1;
  opacity:0;animation:emerge 2.6s ease forwards .4s}
[data-theme="dark"] .hero-han{text-shadow:0 0 50px rgba(244,241,234,.15)}
.hero-sub{font-family:var(--serif-ko);font-weight:400;font-size:clamp(.95rem,2.2vw,1.35rem);
  letter-spacing:.5em;color:var(--fg);margin-top:40px;text-indent:.5em;
  opacity:0;animation:emerge 2.6s ease forwards 1.2s}
.hero-en{font-family:var(--serif-en);font-style:italic;font-size:clamp(.9rem,1.5vw,1.1rem);
  letter-spacing:.3em;color:var(--gold-dim);margin-top:18px;opacity:0;animation:emerge 2.6s ease forwards 1.6s}
.hero-verse{max-width:600px;margin-top:54px;font-size:clamp(1rem,1.7vw,1.2rem);font-weight:200;
  color:var(--fg-dim);line-height:2.2;opacity:0;animation:emerge 2.6s ease forwards 2.1s}
@keyframes emerge{from{opacity:0;filter:blur(14px);transform:translateY(20px)}to{opacity:1;filter:blur(0);transform:none}}
.scroll-cue{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);opacity:0;
  animation:fadein 2s forwards 3s;display:flex;flex-direction:column;align-items:center;gap:10px}
.scroll-cue span{font-size:.66rem;letter-spacing:.4em;color:var(--gold-dim);writing-mode:vertical-rl}
.scroll-line{width:1px;height:50px;background:linear-gradient(var(--gold),transparent);animation:drip 2.6s ease-in-out infinite}
@keyframes drip{0%,100%{opacity:.3;transform:scaleY(.6)}50%{opacity:1;transform:scaleY(1)}}
@keyframes fadein{to{opacity:1}}

section{position:relative;z-index:2}
.reveal{opacity:0;transform:translateY(40px);filter:blur(8px);transition:1.4s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:none;filter:blur(0)}
.sec-label{font-family:var(--serif-en);font-style:italic;color:var(--gold);font-size:1rem;letter-spacing:.3em;display:block;margin-bottom:16px}
.sec-title{font-family:var(--serif-ko);font-weight:700;font-size:clamp(1.8rem,4vw,2.7rem);letter-spacing:.07em;line-height:1.5;margin-bottom:38px}

.void{min-height:88vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:130px 24px}
.void-han{font-family:var(--serif-ko);font-weight:800;font-size:clamp(6rem,18vw,15rem);
  color:transparent;-webkit-text-stroke:1px var(--gold-dim);line-height:1;opacity:.45;transition:2s}
.void.in .void-han{opacity:.85;-webkit-text-stroke:1px var(--gold)}
.void-text{max-width:560px;margin-top:46px;font-size:clamp(1.05rem,2vw,1.3rem);font-weight:200;line-height:2.4;color:var(--fg-dim)}
.void-text em{color:var(--ju-soft);font-style:normal;font-family:var(--serif-ko)}

.word{padding:130px 6vw;max-width:1180px;margin:0 auto}
.word-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:66px;align-items:start;margin-top:26px}
.word-date{font-family:var(--serif-en);color:var(--gold);letter-spacing:.2em;font-size:.95rem;margin-bottom:18px}
.word-headline{font-family:var(--serif-ko);font-weight:700;font-size:1.65rem;line-height:1.6;margin-bottom:32px;color:var(--fg)}
.word-text{font-size:1.08rem;font-weight:300;line-height:2.3;color:var(--fg)}
.word-oneline{margin-top:38px;padding:28px 34px;border-left:2px solid var(--ju);background:var(--mist1);
  font-family:var(--serif-ko);font-size:1.18rem;font-weight:400;line-height:1.9;color:var(--ju-soft)}
.word-toon{border:1px solid var(--line);border-radius:3px;overflow:hidden;
  box-shadow:0 30px 90px rgba(0,0,0,.4);position:relative}
.toon-frame{aspect-ratio:3/4;background:var(--bg2);display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:16px;color:var(--gold-dim)}
.toon-frame .icon{font-size:2.8rem;opacity:.4}
.toon-cap{font-size:.76rem;letter-spacing:.2em;opacity:.6}

.master{padding:130px 6vw;display:grid;grid-template-columns:.85fr 1.15fr;gap:76px;align-items:center;max-width:1180px;margin:0 auto}
.master-photo{aspect-ratio:3/4;border-radius:3px;overflow:hidden;background:var(--bg2);
  display:flex;align-items:center;justify-content:center;border:1px solid var(--line);box-shadow:0 30px 80px rgba(0,0,0,.35)}
.master-photo .ph{color:var(--gold-dim);text-align:center;opacity:.5;font-size:.8rem;letter-spacing:.2em;line-height:2}
.master-photo .ph .big{font-size:2.4rem;display:block;margin-bottom:12px;opacity:.6}
.master-name{font-family:var(--serif-ko);font-weight:800;font-size:2.3rem;letter-spacing:.05em}
.master-name small{display:block;font-family:var(--serif-en);font-style:italic;font-weight:300;font-size:1.05rem;color:var(--gold);letter-spacing:.15em;margin-top:10px}
.master-bio{font-size:1.04rem;font-weight:300;line-height:2.3;color:var(--fg-dim);margin-top:26px}
.master-tags{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
.tag{padding:8px 18px;border:1px solid var(--line);border-radius:40px;font-size:.78rem;letter-spacing:.12em;color:var(--gold)}

.paths{padding:130px 6vw 50px;max-width:1180px;margin:0 auto;text-align:center}
.paths-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:54px}
.path{padding:46px 24px;border:1px solid var(--line);border-radius:3px;transition:.6s;cursor:pointer;background:var(--card);position:relative;overflow:hidden}
.path:hover{border-color:var(--gold);background:var(--mist1);transform:translateY(-6px)}
.path .ph-icon{font-size:1.8rem;margin-bottom:20px;display:block}
.path h3{font-family:var(--serif-ko);font-weight:700;font-size:1.12rem;letter-spacing:.06em;margin-bottom:11px}
.path p{font-size:.83rem;color:var(--fg-dim);line-height:1.8;opacity:.8}
.path .soon{position:absolute;top:13px;right:13px;font-size:.58rem;letter-spacing:.15em;color:var(--gold-dim);border:1px solid var(--gold-dim);padding:3px 8px;border-radius:20px;opacity:.6}

.offering{padding:110px 24px;text-align:center}
.offering .lotus{font-size:2.2rem;margin-bottom:22px;filter:saturate(.8)}
.offering p{max-width:480px;margin:0 auto;font-weight:200;line-height:2.2;color:var(--fg-dim)}

footer{position:relative;z-index:2;padding:66px 6vw 48px;border-top:1px solid var(--line);text-align:center;color:var(--fg-dim)}
footer .fbrand{font-family:var(--serif-ko);font-weight:800;letter-spacing:.3em;font-size:1.05rem}
footer .fbrand .han{color:var(--ju-soft)}
footer .finfo{font-size:.78rem;line-height:2;opacity:.6;margin-top:16px}

.word-toon img{display:block;width:100%;height:auto;background:var(--bg2)}
.path-link{display:block;color:inherit;text-decoration:none}
.path-link::after{display:none}
.page-spacer{padding-top:48px}

@media(max-width:860px){
  .menu a:not(.theme-keep){display:none}
  .menu-toggle{display:block}
  .word-grid,.master{grid-template-columns:1fr;gap:42px}
  .paths-grid{grid-template-columns:repeat(2,1fr)}
  .breath-wrap{width:280px;height:280px}.br1{width:280px;height:280px}.br2{width:200px;height:200px}
}