:root{
  --night:#1b2016; --forest:#232a1a; --bark:#2d2822; --brown:#594f47; --tan:#a58254; --gold:#c89c66; --dawn:#ecc88e;
  --olive:#606330; --paper:#f5f1e9; --cream:#fbf8f2; --ink:#39352f; --muted:#716a60; --line:rgba(89,79,71,.18);
  --serif:"Noto Serif TC",serif; --sans:"Noto Sans TC",sans-serif; --en:"Cormorant Garamond",serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:136px;background:var(--night)}
html:has(body.site-auth-enabled){scroll-padding-top:calc(136px + var(--site-auth-height,48px))}
body{margin:0;background:var(--night);color:var(--ink);font-family:var(--sans);line-height:1.95;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit}
:focus-visible{outline:3px solid var(--dawn);outline-offset:4px}
.container{width:min(1160px,calc(100% - 64px));margin-inline:auto}
h1,h2,h3{font-family:var(--serif);font-weight:500;margin:0}
h2{font-size:clamp(30px,3.7vw,46px);line-height:1.5;letter-spacing:.02em}
.section{padding:96px 0;position:relative}

/* 按鈕（頁面其他區塊使用） */
.pill{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:8px 24px;border-radius:999px;font-size:14px;font-weight:500;letter-spacing:.05em;border:1px solid transparent;transition:transform .25s,background .25s,box-shadow .25s}
.pill:hover{transform:translateY(-2px)}
.pill.gold{color:#2a2318;background:linear-gradient(110deg,#d8b277 0%,#f3dba8 45%,#c89c66 100%);background-size:220% 100%;box-shadow:0 10px 26px rgba(200,156,102,.28);animation:shimmer 5.5s ease-in-out infinite}
.pill.ghost{color:#efe3cb;border-color:rgba(236,200,142,.4)}
.pill.ghost:hover{background:rgba(236,200,142,.1)}
@keyframes shimmer{0%,100%{background-position:0% 0}50%{background-position:100% 0}}

/* ===== 頁首：與「兩堂必修課」線上課程頁完全相同（複製自 lingji-practice.html） ===== */
.lj{--deep:#0f1a14;--gold:#a58254;--gold-light:#c8aa7b;--paper:#f5f0e8;--ink:#30271f;--moss:#606330;--brown:#594f47;--slate:#607386;--plum:#705a70;--clay:#a56857;--line:rgba(165,130,84,.25);font-weight:300;line-height:1.9;letter-spacing:.035em}
.lj .container{width:min(1120px,calc(100% - 48px));margin:0 auto}
.lj .hero{position:relative;display:flex;align-items:center;overflow:hidden;color:var(--paper)}
.hero{position:relative;min-height:760px;padding:150px 0 96px;display:flex;align-items:center;overflow:hidden;background:var(--deep);color:var(--paper)}
.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 35%,rgba(165,130,84,.18),transparent 34%),radial-gradient(circle at 18% 78%,rgba(96,99,48,.15),transparent 30%),linear-gradient(135deg,#0b1209 0%,#111a10 55%,#19160f 100%)}
.hero:after{content:"";position:absolute;inset:0;opacity:.16;background-image:linear-gradient(rgba(200,170,123,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(200,170,123,.06) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,black,transparent 90%)}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:70px;align-items:center}
.eyebrow{margin:0 0 20px;color:var(--gold-light);font-family:var(--en);font-size:13px;font-weight:500;letter-spacing:.33em;text-transform:uppercase}
.hero h1{max-width:720px;margin:0;font-family:var(--serif);font-size:clamp(42px,5.1vw,70px);font-weight:500;line-height:1.35;letter-spacing:.06em}
.hero-lead{margin:25px 0 0;color:var(--gold-light);font-family:var(--serif);font-size:clamp(18px,2.1vw,25px);letter-spacing:.08em}
.hero-copy{max-width:680px;margin:24px 0 0;color:rgba(245,240,232,.72);font-size:15.5px;line-height:2}
.hero-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:34px}
.btn{display:inline-flex;min-height:50px;align-items:center;justify-content:center;padding:13px 27px;border:1px solid var(--gold);font-size:13px;letter-spacing:.16em;transition:transform .25s,background .25s,color .25s,border-color .25s}
.btn-primary{background:var(--gold);color:#fff}
.btn-primary:hover{background:var(--gold-light);border-color:var(--gold-light);transform:translateY(-2px)}
.btn-ghost{color:rgba(245,240,232,.72);border-color:rgba(245,240,232,.25)}
.btn-ghost:hover{color:var(--gold-light);border-color:var(--gold);transform:translateY(-2px)}
.facts{position:relative;z-index:4;margin-top:-42px}
.facts-grid{display:grid;grid-template-columns:repeat(3,1fr);background:#fff;border:1px solid var(--line);box-shadow:0 20px 60px rgba(48,39,31,.12)}
.fact{min-height:118px;padding:25px 28px;border-right:1px solid var(--line)}
.fact:last-child{border-right:0}
.fact small{display:block;margin-bottom:7px;color:var(--gold);font-family:var(--en);font-size:11px;letter-spacing:.22em}
.fact strong{display:block;font-family:var(--serif);font-size:20px;font-weight:500;letter-spacing:.06em}
.reveal,.js .reveal,.js .reveal.on{opacity:1;transform:none;transition:none}
@media(max-width:920px){
.hero{min-height:auto;padding:132px 0 86px}
.hero-grid,.research-grid{grid-template-columns:1fr;gap:48px}
}
@media(max-width:768px){
.hero{padding:116px 0 74px}
.hero h1{font-size:clamp(37px,11vw,54px);line-height:1.42}
.hero-copy{font-size:14.5px}
.hero-actions{align-items:stretch;flex-direction:column}
.hero-actions .btn{width:100%}
.facts{margin-top:0}
.facts-grid{grid-template-columns:1fr}
.fact{min-height:auto;border-right:0;border-bottom:1px solid var(--line)}
.fact:last-child{border-bottom:0}
}
.hero{min-height:620px;padding:116px 0 72px}
.hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(330px,.92fr);gap:52px}
.hero h1{font-size:clamp(39px,4.7vw,62px)}
.hero-lead{margin-top:19px;font-size:clamp(17px,1.85vw,22px)}
.hero-copy{max-width:610px;margin-top:18px;line-height:1.85}
.hero-actions{margin-top:27px}
.facts{margin-top:-30px}
.fact{min-height:88px;padding:18px 25px}
.fact:nth-child(1){border-top:3px solid var(--slate)}
.fact:nth-child(2){border-top:3px solid var(--plum)}
.fact:nth-child(3){border-top:3px solid var(--clay)}
.fact small{margin-bottom:3px}
.fact strong{font-size:18px}
@media(max-width:920px){
.hero{padding:108px 0 66px}
.hero-grid,.focus-grid,.evidence-grid{grid-template-columns:1fr;gap:38px}
}
@media(max-width:768px){
.hero{padding:96px 0 54px}
.hero-grid{gap:31px}
.hero h1{font-size:clamp(34px,10vw,46px)}
.hero-lead{font-size:17px;line-height:1.7}
.hero-copy{font-size:14px;line-height:1.75}
.facts-grid{grid-template-columns:repeat(3,1fr)}
.fact{padding:13px 10px;text-align:center;border-right:1px solid var(--line);border-bottom:0}
.fact strong{font-size:13px;line-height:1.5}
.fact small{font-size:8px}
}
.page-progress{position:fixed;top:56px;left:0;right:0;z-index:121;height:2px;pointer-events:none;background:linear-gradient(90deg,var(--slate),var(--plum),var(--clay),var(--gold-light));transform:scaleX(0);transform-origin:left center;box-shadow:0 0 14px rgba(200,170,123,.5);will-change:transform}
.hero{--motion-x:0px;--motion-y:0px;min-height:660px;padding:138px 0 106px;isolation:isolate;background:#0a1710}
.hero:before{z-index:0;background:radial-gradient(ellipse at 81% 35%,rgba(196,206,174,.26),transparent 32%),radial-gradient(circle at 72% 55%,rgba(134,157,119,.2),transparent 35%),radial-gradient(circle at 18% 76%,rgba(83,105,74,.22),transparent 34%),linear-gradient(135deg,#07110b 0%,#102218 55%,#20291c 100%);background-size:118% 118%;animation:forestAmbient 14s ease-in-out infinite alternate}
.hero:after{z-index:2;opacity:1;background:linear-gradient(90deg,rgba(5,13,9,.97) 0%,rgba(6,15,10,.88) 37%,rgba(7,16,11,.32) 66%,rgba(7,15,10,.035) 100%),linear-gradient(to top,rgba(5,12,8,.7),transparent 50%),linear-gradient(to bottom,rgba(6,13,9,.16),transparent 32%);mask-image:none}
.hero-grid{position:relative;z-index:4;display:block}
.hero-content{position:relative;max-width:1040px}
.eyebrow{display:flex;align-items:center;gap:16px;margin-bottom:17px}
.eyebrow:after{content:"";width:118px;height:1px;background:linear-gradient(90deg,var(--gold-light),transparent);transform-origin:left}
.hero h1{max-width:100%;font-size:clamp(50px,6.6vw,88px);line-height:1.18;letter-spacing:.045em}
.hero-title-line{display:block}
.hero-title-accent{width:max-content;max-width:100%;color:var(--gold-light);background:linear-gradient(96deg,#f4eee4 0%,#d5bb8d 42%,#f4eee4 76%,#aab7c3 100%);background-size:220% auto;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:titleLight 9s ease-in-out infinite}
.hero-lead{max-width:920px;margin-top:22px;font-size:clamp(20px,2.2vw,27px);line-height:1.65}
.hero-copy{max-width:790px;margin-top:18px;color:rgba(245,240,232,.76);font-size:17px;font-weight:400;line-height:1.85}
.hero-actions{margin-top:30px}
.hero-forest{position:absolute;z-index:1;inset:0;overflow:hidden;pointer-events:none}
.forest-scene{position:absolute;left:-3%;top:-3%;width:106%;height:106%;opacity:1;transform:translate3d(var(--motion-x),var(--motion-y),0) scale(1.025);transition:transform .7s cubic-bezier(.2,.7,.2,1);filter:saturate(.94) contrast(1.035) brightness(1.08)}
.mountain-back{fill:#52705b;opacity:.35;animation:mountainBreathe 14s ease-in-out infinite alternate}
.mountain-mid{fill:#304c38;opacity:.7}
.forest-ridge-back{color:#213a29;opacity:.83;animation:ridgeDrift 16s ease-in-out infinite alternate}
.forest-ridge-front{color:#10261a;opacity:.96}
.ancient-tree{transform-box:fill-box;transform-origin:82% 100%;animation:treeBreathe 8.5s ease-in-out infinite alternate}
.tree-body{filter:drop-shadow(-15px 17px 22px rgba(0,0,0,.28))}
.tree-trunk{fill:url(#hero-tree-trunk);stroke:rgba(221,193,139,.62);stroke-width:2.15;stroke-linejoin:round}
.tree-branch{fill:none;stroke:url(#hero-tree-trunk);stroke-linecap:round;stroke-linejoin:round}
.branch-heavy{stroke-width:50}
.branch-mid{stroke-width:34}
.branch-fine{stroke-width:21}
.tree-bark path{fill:none;stroke:url(#hero-tree-gold);stroke-width:1.2;stroke-linecap:round;opacity:.42}
.canopy-soft{fill:url(#hero-canopy);opacity:.84;filter:url(#hero-canopy-soft);animation:canopyBreathe 9s ease-in-out infinite alternate}
.canopy-edge{fill:none;stroke:rgba(221,228,205,.42);stroke-width:2.2;opacity:.88;filter:url(#hero-canopy-soft)}
.tree-flow-base use,.tree-flow-motion use{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.tree-flow-base use{stroke:url(#hero-tree-gold);stroke-width:1.35;opacity:.56}
.tree-flow-motion{filter:url(#hero-tree-glow)}
.tree-flow-motion use{stroke:url(#hero-tree-gold-bright);stroke-width:2.15;stroke-dasharray:13 87;stroke-dashoffset:0;animation:treeCurrent 5.8s linear infinite}
.tree-flow-motion use:nth-child(2),.tree-flow-motion use:nth-child(6){animation-delay:-1.15s}
.tree-flow-motion use:nth-child(3),.tree-flow-motion use:nth-child(8){animation-delay:-2.3s}
.tree-flow-motion use:nth-child(4),.tree-flow-motion use:nth-child(9){animation-delay:-3.45s}
.tree-flow-motion use:nth-child(5),.tree-flow-motion use:nth-child(10){animation-delay:-4.6s}
.tree-flow-motion use:nth-child(11){animation-delay:-2.85s}
.tree-flow-motion use:nth-child(12){animation-delay:-4.1s}
.forest-light{position:absolute;z-index:2;right:1%;top:-3%;width:54%;height:82%;border-radius:50%;background:radial-gradient(ellipse,rgba(230,232,198,.28),rgba(178,201,166,.11) 42%,transparent 73%);filter:blur(14px);animation:forestLight 8.5s ease-in-out infinite alternate}
.forest-mist{position:absolute;z-index:3;left:-34%;width:168%;height:142px;opacity:.5;filter:blur(17px);mix-blend-mode:screen;pointer-events:none;will-change:transform;background:radial-gradient(ellipse at 13% 55%,rgba(236,241,232,.48),transparent 19%),radial-gradient(ellipse at 41% 44%,rgba(220,232,221,.4),transparent 24%),radial-gradient(ellipse at 69% 58%,rgba(236,241,232,.36),transparent 21%),radial-gradient(ellipse at 91% 43%,rgba(214,226,216,.34),transparent 18%)}
.forest-mist:after{content:"";position:absolute;left:8%;right:8%;top:45%;height:1px;background:linear-gradient(90deg,transparent,rgba(235,220,186,.22),transparent);filter:blur(2px)}
.mist-one{bottom:15%;animation:mistAcross 18s linear infinite}
.mist-two{bottom:37%;height:116px;opacity:.39;transform:translateX(-10%);animation:mistAcrossReverse 24s linear infinite}
.mist-three{bottom:-1%;height:180px;opacity:.48;filter:blur(25px);animation:mistAcross 31s linear infinite reverse}
.facts{margin-top:-47px}
.facts-grid{position:relative;overflow:hidden;background:rgba(12,22,17,.96);border:1px solid rgba(200,170,123,.22);color:var(--paper);box-shadow:0 24px 62px rgba(13,18,14,.27);backdrop-filter:blur(18px)}
.fact{position:relative;min-height:104px;padding:22px 28px 20px 84px;overflow:hidden;border-top:0!important;border-right:1px solid rgba(200,170,123,.16);background:linear-gradient(135deg,rgba(255,255,255,.025),transparent 60%)}
.fact:before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,var(--slate),var(--gold-light));transform-origin:left}
.fact:nth-child(2):before{background:linear-gradient(90deg,var(--plum),var(--gold-light))}
.fact:nth-child(3):before{background:linear-gradient(90deg,var(--clay),var(--gold-light))}
.fact:after{content:"";position:absolute;inset:-40% auto -40% -38%;width:30%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);transform:skewX(-18deg);pointer-events:none}
.fact-index{position:absolute;left:23px;top:50%;color:rgba(200,170,123,.28);font-family:var(--en);font-size:38px;line-height:1;transform:translateY(-50%)}
.fact small{margin-bottom:2px;color:rgba(200,170,123,.82);font-size:11.5px}
.fact strong{color:var(--paper);font-size:22px;line-height:1.5}
.facts-grid.on .fact:after{animation:factScan 7.8s ease-in-out infinite}
.facts-grid.on .fact:nth-child(2):after{animation-delay:1.3s}
.facts-grid.on .fact:nth-child(3):after{animation-delay:2.6s}
.btn{position:relative;overflow:hidden}
.btn:after{content:"";position:absolute;inset:-1px;pointer-events:none;background:linear-gradient(105deg,transparent 25%,rgba(255,255,255,.22) 48%,transparent 70%);transform:translateX(-125%);transition:transform .65s ease}
.btn:hover:after{transform:translateX(125%)}
.motion-ready .reveal{opacity:0;transform:translate3d(0,28px,0);transition:opacity .82s ease,transform .9s cubic-bezier(.2,.65,.2,1)}
.motion-ready .reveal.on{opacity:1;transform:none}
.motion-ready .hero-content .eyebrow,.motion-ready .hero-content h1,.motion-ready .hero-content .hero-lead,.motion-ready .hero-content .hero-copy,.motion-ready .hero-content .hero-actions{opacity:0;transform:translate3d(0,24px,0)}
.motion-ready .hero-content.on .eyebrow,.motion-ready .hero-content.on h1,.motion-ready .hero-content.on .hero-lead,.motion-ready .hero-content.on .hero-copy,.motion-ready .hero-content.on .hero-actions{animation:contentRise .9s cubic-bezier(.2,.65,.2,1) forwards}
.motion-ready .hero-content.on h1{animation-delay:.08s}
.motion-ready .hero-content.on .hero-lead{animation-delay:.18s}
.motion-ready .hero-content.on .hero-copy{animation-delay:.28s}
.motion-ready .hero-content.on .hero-actions{animation-delay:.38s}
.motion-ready .facts-grid .fact{opacity:0;transform:translate3d(0,22px,0)}
.motion-ready .facts-grid.on .fact{animation:contentRise .72s cubic-bezier(.2,.65,.2,1) forwards}
.motion-ready .facts-grid.on .fact:nth-child(2){animation-delay:.12s}
.motion-ready .facts-grid.on .fact:nth-child(3){animation-delay:.24s}
@keyframes forestAmbient{0%{background-position:0% 0%;filter:saturate(.9)}100%{background-position:100% 70%;filter:saturate(1.05)}}
@keyframes mountainBreathe{0%{transform:translate3d(-9px,2px,0);opacity:.24}100%{transform:translate3d(10px,-5px,0);opacity:.34}}
@keyframes ridgeDrift{0%{transform:translate3d(-7px,0,0)}100%{transform:translate3d(8px,2px,0)}}
@keyframes treeBreathe{0%{transform:rotate(-.22deg) translateY(1px)}100%{transform:rotate(.38deg) translateY(-4px)}}
@keyframes canopyBreathe{0%{opacity:.87;transform:translate3d(-2px,2px,0) scale(.995)}100%{opacity:1;transform:translate3d(3px,-3px,0) scale(1.012)}}
@keyframes treeCurrent{to{stroke-dashoffset:-100}}
@keyframes forestLight{0%{opacity:.58;transform:translate3d(-2%,1%,0) scale(.96)}100%{opacity:1;transform:translate3d(2%,-1%,0) scale(1.06)}}
@keyframes mistAcross{0%{transform:translate3d(-9%,0,0)}50%{transform:translate3d(3%,6px,0)}100%{transform:translate3d(14%,0,0)}}
@keyframes mistAcrossReverse{0%{transform:translate3d(10%,0,0)}50%{transform:translate3d(0,-5px,0)}100%{transform:translate3d(-13%,0,0)}}
@keyframes titleLight{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes factScan{0%,18%{left:-38%;opacity:0}28%{opacity:1}48%,100%{left:118%;opacity:0}}
@keyframes frameScan{0%,68%{left:-35%;opacity:0}76%{opacity:1}92%,100%{left:125%;opacity:0}}
@keyframes contentRise{to{opacity:1;transform:none}}
@keyframes pathDraw{to{transform:scaleX(1)}}
@keyframes nodeReveal{to{opacity:1;transform:none}}
@keyframes darkAura{0%{transform:translate3d(-1.5%,-1%,0) scale(1.02)}100%{transform:translate3d(1.5%,1%,0) scale(1.07)}}
@keyframes softAura{0%{transform:translate3d(-1%,0,0)}100%{transform:translate3d(1%,1%,0)}}
@keyframes borderBreath{0%,100%{opacity:.24}50%{opacity:.68}}
@keyframes lineBreath{0%,100%{width:46px;opacity:.62}50%{width:82px;opacity:1}}
@media(max-width:920px){
.hero{min-height:620px;padding:126px 0 96px}
.hero-content{max-width:840px}
.forest-scene{left:-14%;width:126%;opacity:.9}
.forest-light{right:-7%;width:67%}
.hero h1{font-size:clamp(48px,8vw,72px)}
}
@media(max-width:768px){
.page-progress{top:58px}
.hero{padding:118px 0 78px}
.hero h1{font-size:clamp(40px,12vw,56px);line-height:1.24}
.hero-title-accent{width:auto}
.hero-lead{font-size:19px;line-height:1.6}
.hero-copy{font-size:15.5px;line-height:1.75}
.hero:after{background:linear-gradient(90deg,rgba(5,13,9,.96),rgba(5,13,9,.78) 72%,rgba(5,13,9,.22)),linear-gradient(to top,rgba(5,12,8,.82),transparent 55%)}
.forest-scene{left:-50%;width:175%;opacity:.72}
.forest-light{right:-22%;width:86%;opacity:.72}
.forest-mist{width:210%;left:-55%}
.eyebrow:after{width:64px}
.facts{margin-top:-28px}
.facts-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.facts-grid::-webkit-scrollbar{display:none}
.fact{flex:0 0 78%;min-height:102px;padding:20px 21px 18px 73px;text-align:left;scroll-snap-align:center}
.fact-index{left:20px;font-size:34px}
.fact small{font-size:10.5px}
.fact strong{font-size:20px}
}
@media(prefers-reduced-motion:reduce){
.page-progress{display:none}
.hero:before,.hero-title-accent,.mountain-back,.forest-ridge-back,.ancient-tree,.canopy-soft,.tree-flow-motion use,.forest-light,.forest-mist,.facts-grid.on .fact:after,.course-video-frame:after,.instructor-photo:after,.compact-principle .principle-mark,.section-dark:before,.instructor-feature:before,.gentle-section:before{animation:none!important}
.forest-scene{transform:scale(1.025)!important;transition:none}
.motion-ready .reveal,.motion-ready .reveal.on,.motion-ready .hero-content *,.motion-ready .facts-grid .fact,.motion-ready .learning-path .path-step,.motion-ready .book-shelf .book-item,.motion-ready .stage-grid .stage-card{opacity:1!important;transform:none!important;animation:none!important;transition:none!important}
}
.course-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 17px;color:rgba(245,240,232,.5);font-size:11px;letter-spacing:.1em}
.course-breadcrumb a{color:var(--gold-light);border-bottom:1px solid rgba(200,170,123,.38)}
.course-breadcrumb a:hover{color:#f2d8a8}
.course-breadcrumb span[aria-current="page"]{color:rgba(245,240,232,.68)}

/* 開場：夜色轉入黃昏 */
.opening{background:linear-gradient(180deg,#0a1710 0,var(--bark) 220px,#3a332b 100%);color:#d9cfbd;padding-top:96px}
.opening::before{content:"";position:absolute;left:-10%;top:10%;width:60%;aspect-ratio:1;background:radial-gradient(circle,rgba(200,156,102,.14),transparent 62%);pointer-events:none}
.opening .grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:72px;position:relative}
.opening h2{color:#f6ebd4}
.note{margin-top:24px;color:#bda87f;font-size:15px}
.prose p{margin:0 0 22px;font-size:18px;line-height:2.05}
.prose p:last-child{margin:0}

/* 適合誰：光暈邊框 */
.audience{background:linear-gradient(180deg,#3a332b 0%,#2f2a22 100%);color:#d9cfbd;padding-bottom:40px}
.audience h2{color:#f6ebd4}
.head2{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:end}
.intro{color:#bcb09b;font-size:17px;line-height:2;margin:0}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:48px}
.gcard{position:relative;padding:34px 32px 34px 96px;border-radius:26px;border:1px solid transparent;
  background:linear-gradient(#2a2620,#26221c) padding-box,radial-gradient(260px circle at var(--mx,50%) var(--my,0%),rgba(247,214,150,.95),rgba(165,130,84,.22) 68%) border-box;
  transition:transform .35s}
.gcard::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(320px circle at var(--mx,50%) var(--my,0%),rgba(236,200,142,.12),transparent 70%);opacity:0;transition:opacity .35s;pointer-events:none}
.gcard:hover{transform:translateY(-4px)}.gcard:hover::after{opacity:1}
.mark{position:absolute;left:32px;top:36px;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1px solid rgba(236,200,142,.55);color:var(--dawn);font-family:var(--serif);font-size:20px;box-shadow:0 0 22px rgba(236,200,142,.2) inset}
.gcard h3{font-size:21px;line-height:1.65;color:#f3e6cc;margin-bottom:10px}
.gcard p{margin:0;font-size:16px;line-height:1.95;color:#bdb19c}

/* 地平線：夜到晨 */
.blend{height:96px;background:linear-gradient(180deg,#2f2a22 0%,#6b5a44 45%,#d9c4a0 82%,var(--paper) 100%)}

/* 課程：捲動進度 */
.curriculum{background:var(--paper)}
.cgrid{display:grid;grid-template-columns:.72fr 1.28fr;gap:80px;align-items:start}
.cintro{position:sticky;top:130px}
.cintro p{color:var(--muted);font-size:17px;margin:22px 0 0}
.tlink{display:inline-flex;align-items:center;min-height:44px;margin-top:24px;color:var(--olive);border-bottom:1px solid rgba(96,99,48,.4);font-size:14px;font-weight:500}
.modules{position:relative;padding-left:48px;--lp:0%}
.track{position:absolute;left:8px;top:8px;bottom:8px;width:2px;background:rgba(89,79,71,.16);border-radius:2px}
.track i{position:absolute;left:0;top:0;width:100%;height:var(--lp);background:linear-gradient(180deg,var(--tan),var(--dawn));border-radius:2px;box-shadow:0 0 14px rgba(200,156,102,.6)}
.module{position:relative;padding:34px 0 34px;border-bottom:1px solid var(--line);transition:opacity .5s}
.module:last-child{border-bottom:0}
.module::before{content:"";position:absolute;left:-45px;top:46px;width:12px;height:12px;border-radius:50%;background:var(--paper);border:2px solid #cdbb9b;transition:.4s}
.js .module{opacity:.38}.js .module.on{opacity:1}
.module.on::before{background:var(--gold);border-color:var(--gold);box-shadow:0 0 0 6px rgba(200,156,102,.22),0 0 18px rgba(200,156,102,.7)}
.mno{font-family:var(--en);font-size:15px;font-weight:600;color:var(--tan);letter-spacing:.2em}
.module h3{font-size:26px;line-height:1.6;margin:4px 0 14px}
.module p{margin:0;color:#6d655b;font-size:17px;line-height:2}
.module ul{margin:16px 0 0;padding-left:20px;color:#706a5d;font-size:15px;line-height:2}
.module li::marker{color:#b8a37e}

/* 實修與影片：霧氣 */
.practice{background:#1f2418;color:#e9e3d2;overflow:hidden}
.mist{position:absolute;inset:0;pointer-events:none;filter:blur(60px)}
.mist i{position:absolute;border-radius:50%;opacity:.55}
.mist i:nth-child(1){width:46%;aspect-ratio:1;left:-8%;top:-10%;background:#606330;animation:drift1 26s ease-in-out infinite alternate}
.mist i:nth-child(2){width:38%;aspect-ratio:1;right:-6%;top:30%;background:#8a6a3c;opacity:.4;animation:drift2 32s ease-in-out infinite alternate}
.mist i:nth-child(3){width:42%;aspect-ratio:1;left:30%;bottom:-18%;background:#4b5430;animation:drift3 29s ease-in-out infinite alternate}
@keyframes drift1{to{transform:translate(18%,22%) scale(1.15)}}
@keyframes drift2{to{transform:translate(-22%,-16%) scale(.9)}}
@keyframes drift3{to{transform:translate(-14%,-20%) scale(1.2)}}
.practice .container{position:relative}
.practice h2{color:#f6ebd4}
.pgrid{display:grid;grid-template-columns:.85fr 1.15fr;gap:72px}
.practice .prose{color:#e0d9c6}
.practice .prose p{font-size:17px}
.vhead{margin-top:104px;padding-top:56px;border-top:1px solid rgba(236,200,142,.22)}
.vgrid{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:40px}
.video-frame{position:relative;aspect-ratio:16/9;border-radius:20px;overflow:hidden;background:#12160c;box-shadow:0 18px 44px rgba(0,0,0,.35)}
.video-frame img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.video-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.62),transparent 48%)}
.video-frame:hover img{transform:scale(1.04)}
.play-icon{position:absolute;z-index:1;top:50%;left:50%;transform:translate(-50%,-50%);width:66px;height:66px;border-radius:50%;border:1px solid rgba(255,255,255,.7);background:rgba(40,38,28,.55);backdrop-filter:blur(6px);display:grid;place-items:center}
.play-icon::after{content:"";margin-left:5px;border-left:16px solid #fff;border-block:10px solid transparent}
.vcopy{padding:20px 4px 0}
.vcopy small{color:#c9a56f;font-size:12px;letter-spacing:.1em}
.vcopy h3{font-size:23px;line-height:1.6;margin:4px 0 10px;color:#f3e6cc}
.vcopy p{margin:0 0 12px;color:#c4baa5;font-size:16px;line-height:1.95}
.vcopy a{color:var(--dawn);border-bottom:1px solid rgba(236,200,142,.4);font-size:14px}

/* 延伸閱讀、作者 */
.reading{background:#eee7dc;border-block:1px solid var(--line)}
.rgrid{display:grid;grid-template-columns:.7fr 1.3fr;gap:90px;align-items:center}
.book{max-width:290px;margin:auto;filter:drop-shadow(14px 22px 18px rgba(59,49,34,.2));transition:transform .3s}
.book:hover{transform:translateY(-6px) rotate(-1deg)}
.sub{margin:16px 0 26px;color:#8a7252;font-size:15px}
.reading .prose{color:#645d53}
.links{display:flex;flex-wrap:wrap;gap:8px 26px;margin-top:22px}
.origin{background:var(--cream)}
.ogrid{display:grid;grid-template-columns:.8fr 1.2fr;gap:84px;align-items:center}
.portrait{max-width:340px;margin:auto;overflow:hidden;border-radius:180px 180px 18px 18px;box-shadow:0 24px 50px rgba(70,53,34,.16)}
.origin h2 small{font-size:.67em;color:#696c3d;font-weight:500}
.role{margin:18px 0 26px;color:#9a8160;font-size:13px;letter-spacing:.13em}
.origin .prose{color:#655e55}
.tnote{margin:24px 0 0;padding-top:18px;border-top:1px solid var(--line);color:#887b6a;font-size:13px}

/* 學員回饋 */
.testi{background:linear-gradient(180deg,#f6f1e8,#eee8dd)}
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
.tcard{margin:0;padding:34px 28px 28px;border-radius:24px;display:flex;flex-direction:column;border:1px solid rgba(165,130,84,.16);background:linear-gradient(145deg,#fffdfa,#eee6db);box-shadow:0 18px 42px rgba(70,53,34,.1),inset 5px 5px 10px rgba(255,255,255,.58),inset -6px -6px 12px rgba(89,79,71,.07)}
.tcard:nth-child(2){background:linear-gradient(145deg,#faf5ed,#e8ded0)}
.tcard:nth-child(3){background:linear-gradient(145deg,#f7f8ee,#dde1ca)}
.tcard::before{content:"“";font-family:var(--serif);font-size:56px;line-height:.6;color:var(--gold);height:26px}
.tcard blockquote{margin:0 0 24px;font-family:var(--serif);font-size:18px;line-height:2;color:#61594c}
.tcard figcaption{margin-top:auto;color:#8b7f6d;font-size:12px}

/* 常見問題 */
.faq{background:var(--cream)}
.fgrid{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px}
.flist{border-top:1px solid var(--line)}
.flist details{border-bottom:1px solid var(--line)}
.flist summary{position:relative;padding:23px 40px 23px 0;list-style:none;cursor:pointer;font-size:17px;font-weight:500;line-height:1.85}
.flist summary::-webkit-details-marker{display:none}
.flist summary::after{content:"";position:absolute;right:4px;top:30px;width:14px;height:14px;background:linear-gradient(var(--tan),var(--tan)) center/100% 1.5px no-repeat,linear-gradient(var(--tan),var(--tan)) center/1.5px 100% no-repeat;transition:transform .35s}
.flist details[open] summary::after{transform:rotate(135deg)}
.flist details p{margin:0;padding-bottom:24px;color:#766b5d;font-size:16px;line-height:2}
.flist a{color:var(--olive);border-bottom:1px solid currentColor}

/* 講師區塊：與線上課程頁相同 */
.ins{position:relative;overflow:hidden;background:#0c1712;color:#f5f0e8}
.ins::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 48%,rgba(165,104,87,.14),transparent 34%),radial-gradient(circle at 78% 18%,rgba(96,115,134,.14),transparent 36%)}
.ins-layout{position:relative;z-index:1;display:grid;grid-template-columns:minmax(300px,390px) minmax(0,1fr);gap:64px;align-items:center;padding:66px 0;width:min(1120px,calc(100% - 48px))}
.ins-photo{position:relative;margin:0;padding:10px;border:1px solid rgba(200,170,123,.3);background:linear-gradient(145deg,rgba(96,115,134,.2),rgba(165,104,87,.18));box-shadow:0 24px 60px rgba(0,0,0,.3)}
.ins-photo::before{content:"";position:absolute;z-index:2;left:-14px;top:34px;width:44px;height:1px;background:#c8aa7b}
.ins-photo img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center 38%}
.ins-label{display:flex;align-items:center;gap:11px;width:max-content;max-width:100%;margin-bottom:13px;color:#c8aa7b;font-family:var(--en);font-size:12px;font-weight:500;letter-spacing:.28em;text-transform:uppercase}
.ins-label::after{content:"";width:42px;height:1px;background:linear-gradient(90deg,currentColor,transparent);opacity:.65}
.ins-copy h2{margin:0;font-size:clamp(34px,4vw,49px);line-height:1.3;letter-spacing:.07em;color:#f5f0e8}
.ins-role{margin:11px 0 25px;color:rgba(245,240,232,.5);font-family:var(--en);font-size:14px;letter-spacing:.18em}
.ins-copy p{max-width:660px;margin:0 0 16px;color:rgba(245,240,232,.8);font-size:17px;font-weight:400;line-height:1.8}
.ins-copy p:last-child{margin-bottom:0}
.ins-copy .ins-quote{margin-top:20px;padding:14px 18px;border-left:2px solid #607386;background:rgba(255,255,255,.04);color:rgba(245,240,232,.9);font-family:var(--serif);font-size:18px;line-height:1.65}

/* 結尾行動區：與線上課程頁相同的版型 */
.fcta{position:relative;overflow:hidden;padding:105px 0;text-align:center;background:#0f1a14;color:#f5f0e8}
.fcta::before{content:"";position:absolute;inset:-40%;background:radial-gradient(circle,rgba(165,130,84,.19),transparent 42%)}
.fcta-inner{position:relative;z-index:1;width:min(820px,calc(100% - 48px));margin:0 auto}
.fcta .ins-label{margin-inline:auto}
.fcta h2{margin:0;font-size:clamp(32px,4.7vw,52px);line-height:1.55;letter-spacing:.07em;color:#f5f0e8}
.fcta p{margin:22px auto 31px;max-width:640px;color:rgba(245,240,232,.65);font-size:15px;line-height:2}
.fcta-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.fcta-note{display:block;margin-top:17px;color:rgba(245,240,232,.36);font-size:11px;letter-spacing:.08em;line-height:1.9}
.fcta-link{display:inline-block;margin-top:14px;color:#c8aa7b;font-size:13px;letter-spacing:.06em;border-bottom:1px solid rgba(200,170,123,.38)}
.fcta-link:hover{color:#ecc88e}

/* 頁尾：與線上課程頁相同 */
.lfoot{background:rgba(6,9,5,.98);border-top:1px solid rgba(165,130,84,.1);padding:36px 0 28px}
.lfoot-inner{display:flex;flex-direction:column;align-items:center;gap:14px}
.lfoot-mark{width:130px;max-width:42vw;filter:brightness(.78)}
.lfoot-links{display:flex;gap:28px;flex-wrap:wrap;justify-content:center}
.lfoot-links a{color:rgba(245,240,232,.38);display:flex;transition:.2s}
.lfoot-links a:hover{color:#a58254;transform:translateY(-2px)}
.lfoot-links svg{display:block}
.lfoot-copy{margin:0;font-size:11px;color:rgba(245,240,232,.2);letter-spacing:.12em}

/* 手機固定報名 */
.mcta{position:fixed;z-index:1150;left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom));display:none;transform:translateY(140%);transition:transform .45s}
.mcta.show{transform:none}
.mcta .pill{width:100%}

@media(max-width:1050px){
  .opening .grid,.pgrid,.head2,.cgrid,.rgrid,.ogrid,.fgrid{gap:44px}
}
@media(max-width:760px){
  .container{width:calc(100% - 40px)}
  .section{padding:64px 0}
  .opening .grid,.pgrid,.head2,.cgrid,.rgrid,.ogrid,.fgrid,.vgrid,.tgrid,.cards{grid-template-columns:1fr;gap:28px}
  .cards{gap:16px;margin-top:32px}
  .gcard{padding:26px 22px 26px 80px;border-radius:22px}.mark{left:22px;top:28px;width:42px;height:42px}
  .blend{height:72px}
  .cintro{position:static}
  .modules{padding-left:38px}.module::before{left:-35px}.module h3{font-size:22px}
  .vhead{margin-top:64px;padding-top:40px}
  .tcard{padding:28px 24px 24px}
  .ins-layout{grid-template-columns:1fr;gap:34px;padding:54px 0}
  .ins-photo{width:min(330px,100%);margin:0 auto}
  .ins-copy h2{font-size:37px}
  .fcta{padding:60px 0 120px}
  .fcta-actions .btn{width:100%}
  .mcta{display:block}
  .prose p{font-size:17px}
  h2 br{display:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .module{opacity:1}
}

/* ===== 跳至內容 ===== */
.skip-link{position:fixed;top:-100px;left:16px;z-index:1600;padding:8px 16px;background:var(--cream);color:var(--ink)}
.skip-link:focus{top:64px}

/* ===== 本頁小導覽（深色版，維持原本的跳轉功能） ===== */
.course-subnav{position:sticky;z-index:800;top:56px;margin-top:44px;background:rgba(15,21,13,.9);border-block:1px solid rgba(200,156,102,.22);backdrop-filter:blur(14px)}
body.site-auth-enabled .course-subnav{top:calc(56px + var(--site-auth-height,48px))}
.subnav-inner{display:flex;justify-content:space-between;align-items:center;gap:24px}
.subnav-links{display:flex;gap:26px;overflow-x:auto;scrollbar-width:none}
.subnav-links::-webkit-scrollbar{display:none}
.subnav-links a{position:relative;flex:none;padding:15px 0 13px;color:#bfb399;font-size:13px;letter-spacing:.06em;line-height:1.7;transition:color .2s}
.subnav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.subnav-links a:hover,.subnav-links a.active{color:#f3e6cc}
.subnav-links a:hover::after,.subnav-links a.active::after{transform:scaleX(1)}
.subnav-cta{flex:none;color:var(--dawn);font-size:13px;font-weight:600}

/* ===== 影片：點擊才載入（沿用原本機制） ===== */
.video-poster{position:relative;display:block;width:100%;height:100%;padding:0;border:0;background:#12160c;color:#fff;cursor:pointer}
.video-poster img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.video-poster::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.62),transparent 48%)}
.video-poster:hover img{transform:scale(1.04)}
.play-label{position:absolute;z-index:1;left:20px;bottom:14px;font-size:12px;letter-spacing:.08em}
.video-frame iframe{display:block;width:100%;height:100%;border:0}
.vcopy .tlink{color:var(--dawn);border-color:rgba(236,200,142,.4);margin-top:4px}
.video-note{color:#c4baa5;font-size:14px}

/* ===== 課堂照片：金色角框，與線上課程頁的畫框語言一致 ===== */
.frame{position:relative;margin:0}
.frame::before,.frame::after{content:"";position:absolute;z-index:3;width:74px;height:74px;border-color:rgba(200,170,123,.55);pointer-events:none}
.frame::before{left:-14px;top:-14px;border-left:1px solid;border-top:1px solid}
.frame::after{right:-14px;bottom:-14px;border-right:1px solid;border-bottom:1px solid}
.frame img{display:block;width:100%;height:100%;object-fit:cover}
.mimg figcaption{margin-top:14px;color:#a89d88;font-size:12px;letter-spacing:.1em}
.mimg{max-width:400px;margin-top:26px}
.mimg::before,.mimg::after{width:56px;height:56px;border-color:rgba(165,130,84,.6)}
.mimg img{aspect-ratio:1027/681;box-shadow:0 18px 40px rgba(70,53,34,.22)}
@media(max-width:760px){
  .frame::before{left:-8px;top:-8px;width:52px;height:52px}
  .frame::after{right:-8px;bottom:-8px;width:52px;height:52px}
  .mimg{max-width:100%}
}
@media(max-width:768px){.course-subnav{top:58px;margin-top:30px}body.site-auth-enabled .course-subnav{top:calc(58px + var(--site-auth-height,52px))}.subnav-inner{width:100%;padding-left:20px;gap:0}.subnav-links{flex:1;gap:20px;padding-right:20px}.subnav-links a{font-size:12px}.subnav-cta{padding:12px 15px;font-size:12px;border-left:1px solid rgba(200,156,102,.22)}}


/* 第一章：課堂照片淡化為背景，文字疊在照片上 */
.opening{overflow:hidden}
.opening .grid{z-index:1}
.opening-photo{position:absolute;inset:0;margin:0;z-index:0;pointer-events:none}
.opening-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 78%;opacity:.3;filter:sepia(.25) saturate(.9);
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 24%,#000 62%,transparent 100%),radial-gradient(120% 90% at 50% 55%,#000 40%,transparent 100%);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,transparent 0,#000 24%,#000 62%,transparent 100%),radial-gradient(120% 90% at 50% 55%,#000 40%,transparent 100%);mask-composite:intersect}
.opening-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(38,32,26,.55),rgba(38,32,26,.15) 55%,rgba(38,32,26,.4))}

/* 適合誰：同一 CI 色（金棕）以四種漸層濃度呈現 */
.cards .gcard{background:var(--g,linear-gradient(#2a2620,#26221c)) padding-box,radial-gradient(260px circle at var(--mx,50%) var(--my,0%),rgba(247,214,150,.95),rgba(165,130,84,.3) 68%) border-box}
.cards .gcard:nth-child(1){--g:linear-gradient(135deg,#8a6a3f 0%,#5d4a31 55%,#34291d 100%)}
.cards .gcard:nth-child(2){--g:linear-gradient(225deg,#7a5f3a 0%,#4c3d2b 55%,#2d2519 100%)}
.cards .gcard:nth-child(3){--g:linear-gradient(45deg,#6a5334 0%,#3f3324 55%,#2a2318 100%)}
.cards .gcard:nth-child(4){--g:linear-gradient(315deg,#9a7646 0%,#654f33 50%,#33291c 100%)}
.cards .gcard .mark{background:linear-gradient(145deg,rgba(236,200,142,.32),rgba(236,200,142,.06));border-color:rgba(236,200,142,.75)}
.cards .gcard h3{color:#fbf1da}
.cards .gcard p{color:#e3d6bd;font-size:16px;line-height:1.95}

/* 課程脈絡：講師照片已在講師區塊出現，這裡改為單欄 */
.ogrid.ogrid-solo{grid-template-columns:1fr;max-width:820px}