/* 首頁專用樣式 */
:root{--home-ink:#172033;--home-muted:#465266;--home-green:#a5b387;--home-line:#e5e7eb;--home-pale:#f5f5f4}
*{box-sizing:border-box}
body{margin:0;color:var(--home-ink);font:16px/1.75 "Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif}
a{color:inherit}
.home-main{overflow:hidden}
.home-wrap{width:min(1320px,calc(100% - 64px));margin-inline:auto}
.home-section{padding:72px 0}
.home-heading{font-size:clamp(32px,4vw,54px);line-height:1.2;font-weight:500;margin:0 0 28px;letter-spacing:.01em}
.home-copy{font-size:clamp(16px,1.12vw,20px);color:var(--home-muted)}
.home-copy p{margin:0 0 22px}
.home-copy a{color:#76835a;text-decoration:underline;text-underline-offset:3px}
.home-buttons{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-top:30px}
.home-btn{display:inline-flex;align-items:center;justify-content:center;min-height:58px;padding:12px 30px;border-radius:4px;background:var(--home-green);color:#fff;font-size:19px;font-weight:700;text-decoration:none;transition:transform .18s ease,filter .18s ease}
.home-btn:hover{transform:translateY(-2px);filter:brightness(.97)}
.home-btn.green{background:var(--home-green)}
.hero{position:relative;isolation:isolate;padding:22px 0 52px;background:radial-gradient(ellipse at 53% 25%,rgba(220,246,246,.94),transparent 30%),radial-gradient(ellipse at 14% 50%,rgba(255,247,223,.9),transparent 31%),radial-gradient(ellipse at 88% 30%,rgba(246,226,215,.9),transparent 35%),linear-gradient(105deg,#e4e0d8,#d6e8e7 50%,#e8dcd4)}
.hero:before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(circle at 27% 34%,rgba(255,255,255,.78) 0 20px,transparent 38px),radial-gradient(circle at 40% 16%,rgba(255,255,255,.56) 0 30px,transparent 56px),radial-gradient(circle at 57% 46%,rgba(255,255,255,.55) 0 22px,transparent 46px),radial-gradient(circle at 79% 12%,rgba(255,255,255,.58) 0 25px,transparent 49px);filter:blur(8px)}
/* Remove blurred decorative spots that read as ghost images beside the cover. */
.hero:before{display:none}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.95fr);align-items:center;gap:24px}
.hero-copy{padding:32px 34px;background:rgba(255,255,255,.76);backdrop-filter:blur(4px)}
.hero h1{font-size:clamp(42px,5.2vw,82px);line-height:1.28;font-weight:500;margin:0 0 30px}
.hero-copy .home-copy{font-size:clamp(16px,1vw,20px)}
.hero-book{display:block;width:100%;max-height:740px;object-fit:cover;object-position:center;box-shadow:0 10px 35px rgba(28,35,44,.14)}
.home-note{font-size:15px;color:#4b5563;margin:24px 0 0}
.about-jung{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(0,1fr);gap:clamp(36px,5vw,80px);align-items:center}
.jung-photo{width:100%;height:clamp(440px,62vw,760px);object-fit:cover;object-position:center 30%;filter:grayscale(1)}
.about-text h2{font-size:clamp(34px,3.4vw,55px);font-weight:500;line-height:1.25;margin:0 0 24px}
.about-text hr{border:0;border-top:1px solid #777;margin:45px 0 36px}
.features{background:#fff}
.feature-grid{display:grid;grid-template-columns:minmax(320px,.92fr) minmax(0,1.25fr);gap:42px;align-items:center}
.feature-copy{padding:16px 0}
.feature-copy h2{font-size:clamp(34px,3.5vw,56px);font-weight:500;line-height:1.25;margin:0 0 28px}
.feature-copy p{margin:0 0 20px}
.feature-actions{display:flex;align-items:center;justify-content:flex-start;gap:16px;margin-top:38px;flex-wrap:wrap}

.latest{padding-top:18px}
.latest-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:18px}
.latest-head h2{font-size:clamp(28px,3vw,42px);font-weight:500;margin:0}
.latest-head a{font-weight:600;text-underline-offset:4px}
.carousel{position:relative}
.carousel-track{display:grid;grid-auto-columns:calc((100% - 36px)/3);grid-auto-flow:column;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:6px 2px 14px;overscroll-behavior-inline:contain}
.carousel-track::-webkit-scrollbar{display:none}
.carousel-control{position:absolute;z-index:2;top:31%;width:56px;height:66px;border:0;background:#fff;color:#111;font-size:36px;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.1)}
.carousel-control:hover{background:#f7f7f7}.carousel-control.prev{left:0}.carousel-control.next{right:0}
.carousel-dots{display:flex;justify-content:center;gap:12px;padding:10px}.carousel-dots button{border:0;width:11px;height:11px;padding:0;border-radius:50%;background:#c9c9c9;cursor:pointer}.carousel-dots button[aria-current=true]{background:#111}

.article-card{min-width:0;border-radius:20px;overflow:hidden;background:#e9e9e9;display:flex;flex-direction:column;min-height:430px;scroll-snap-align:start;text-decoration:none;color:#111;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.article-cover{position:relative;height:clamp(220px,25vw,360px);overflow:hidden;background:#d7d7d7}
.article-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.article-card:hover .article-cover img{transform:scale(1.035)}
.article-cover:after{content:"";position:absolute;inset:auto 0 0;height:36%;background:linear-gradient(transparent,rgba(12,16,22,.74));transition:height .25s ease}
.article-card:hover .article-cover:after{height:54%}
.article-cover-title{position:absolute;z-index:1;bottom:0;left:0;right:0;color:#fff;padding:12px 16px;font-size:18px;font-weight:700;line-height:1.4}
.article-meta{display:flex;flex-direction:column;flex:1;align-items:center;text-align:center;padding:16px 18px 22px}
.article-category{color:#818181;text-decoration:underline;text-underline-offset:3px;font-size:15px;margin-bottom:8px}
.article-title{font-size:clamp(18px,1.4vw,24px);font-weight:600;line-height:1.42;margin:0 0 12px}
.article-excerpt{font-size:14px;color:#555;line-height:1.55;margin:0}
.article-date{font-size:13px;color:#747474;margin-top:auto;padding-top:14px}

.type-section{background:#f3f3f3;padding:56px 0 60px}
.type-section h2{text-align:center;font-size:clamp(34px,4vw,56px);font-weight:500;margin:0 0 42px}
.type-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px}
.type-card{display:block;overflow:hidden;transition:transform .2s ease}.type-card:hover{transform:translateY(-4px)}
.type-card img{display:block;width:100%;height:auto;aspect-ratio:2/1;object-fit:cover}
.social-about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(42px,5vw,78px);padding:66px 0 56px;align-items:start}
.social-about h2{font-size:clamp(34px,4vw,58px);font-weight:500;line-height:1.2;margin:0 0 30px}
.ig-profile{display:flex;align-items:center;gap:16px;margin:0 0 24px;text-decoration:none;font-family:Georgia,serif;font-weight:700;font-size:20px}
.ig-avatar{width:76px;height:76px;display:block;object-fit:cover;border-radius:50%;flex:none}
.ig-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.ig-card{aspect-ratio:1;background:#f0f0f0;overflow:hidden;display:block}.ig-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .2s ease}.ig-card:hover img{transform:scale(1.04)}
.ig-empty{min-height:210px;display:flex;align-items:center;justify-content:center;text-align:center;padding:22px;background:#f6f5f2;color:#5a6270;border:1px dashed #c8cbd0}
.ig-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:22px}
.ig-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 18px;border-radius:5px;background:#4b4b4b;color:#fff;text-decoration:none;font-weight:700}.ig-button.follow{background:var(--home-green);color:var(--home-ink)}
.site-about h3{font-size:17px;margin:20px 0 0}.site-about p{margin:0 0 16px;color:var(--home-muted);font-size:clamp(15px,1.1vw,19px)}
.support-row{display:flex;align-items:center;justify-content:flex-start;gap:28px;margin-top:50px}

.home-social-icon{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;color:#fff;text-decoration:none;flex:none;transition:transform .18s ease,filter .18s ease}.home-social-icon:hover{transform:translateY(-2px);filter:brightness(.95)}.home-social-icon svg{width:38px;height:38px;display:block}.home-social-icon.instagram{background:#e94fb3}.home-social-icon.threads{background:#000}.home-social-icon.discord{background:#5865d9}.home-social-icon.instagram svg{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.home-social-icon.threads svg,.home-social-icon.discord svg{fill:currentColor}
@media(max-width:900px){.home-wrap{width:calc(100% - 48px)}.home-section{padding:52px 0}.hero-grid{grid-template-columns:1fr 36%;gap:16px}.hero-copy{padding:24px}.about-jung{grid-template-columns:.8fr 1fr;gap:28px}.feature-grid{grid-template-columns:1fr}.feature-copy{max-width:760px}.carousel-track{grid-auto-columns:calc((100% - 18px)/2)}.type-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.social-about{grid-template-columns:1fr 1fr;gap:30px}}
@media(max-width:620px){.home-wrap{width:calc(100% - 32px)}.home-section{padding:42px 0}.hero{padding:16px 0 36px}.hero-grid{grid-template-columns:1fr}.hero-copy{padding:22px 20px}.hero h1{font-size:42px;margin-bottom:18px}.hero-book{max-height:520px;width:min(100%,390px);margin:0 auto;object-fit:cover}.home-buttons{gap:12px;margin-top:20px}.home-btn{font-size:16px;min-height:50px;padding:10px 18px}.home-note{font-size:13px}.about-jung{grid-template-columns:1fr;gap:24px}.jung-photo{height:auto;max-height:500px;object-fit:cover}.about-text h2{font-size:34px}.about-text hr{margin:30px 0 24px}.feature-grid{gap:24px}.feature-copy h2{font-size:34px}.feature-actions{justify-content:flex-start}.latest{padding-top:2px}.latest-head{align-items:start;gap:12px;flex-direction:column}.carousel-track{grid-auto-columns:86%;gap:14px}.article-card{min-height:385px}.article-cover{height:245px}.type-section{padding:40px 0}.type-section h2{margin-bottom:26px}.type-grid{gap:12px}.social-about{grid-template-columns:1fr;gap:46px;padding:42px 0}.social-about h2{font-size:36px;margin-bottom:20px}.ig-avatar{width:58px;height:58px}.ig-grid{gap:7px}.ig-empty{min-height:160px}.support-row{justify-content:flex-start;gap:16px;margin-top:30px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}


/* Text-only cards for the homepage latest-article carousel. */
.latest .article-card--text{min-height:clamp(300px,25vw,360px);border:1px solid var(--cj-line,#ded8c9);border-radius:7px;background:linear-gradient(145deg,#fffdf8 0%,var(--cj-paper-light,#fbf9f3) 100%);color:var(--cj-ink,#263044);box-shadow:0 7px 22px rgba(43,55,45,.055);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.latest .article-card--text:hover,.latest .article-card--text:focus-visible{transform:translateY(-3px);border-color:var(--cj-gold,#a7833e);box-shadow:0 12px 28px rgba(43,55,45,.09)}
.latest .article-card--text .article-meta{align-items:flex-start;text-align:left;padding:24px clamp(19px,2vw,28px) 22px}
.latest .article-card--text .article-category{margin:0 0 13px;color:var(--cj-gold,#a7833e);font-size:13px;letter-spacing:.08em;text-decoration:none}
.latest .article-card--text .article-title{margin:0 0 6px;color:var(--cj-green-deep,#405b49);font-size:clamp(20px,1.55vw,25px);font-weight:600;line-height:1.5}
.latest .article-card--text .article-date{order:initial;margin:0;padding:0;color:var(--cj-muted,#7c8178);font-size:14px}
.latest .article-card--text .article-excerpt{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:4;margin:15px 0 16px;color:var(--cj-muted,#667085);font-size:15px;line-height:1.8}
.latest .article-card-more{display:flex;align-items:center;gap:7px;margin-top:auto;color:var(--cj-green,#405b49);font-size:14px;font-weight:600;letter-spacing:.04em}
.latest .article-card-more span{font-size:22px;line-height:1;transition:transform .2s ease}
.latest .article-card--text:hover .article-card-more span{transform:translateX(3px)}
.latest .carousel-control{top:50%;transform:translateY(-50%);border:1px solid var(--cj-line,#ded8c9);border-radius:50%;background:var(--cj-paper-light,#fbf9f3);color:var(--cj-green,#405b49);font-family:Georgia,serif;font-size:32px;line-height:1;box-shadow:0 4px 14px rgba(43,55,45,.1);transition:background-color .2s ease,color .2s ease,transform .2s ease}
.latest .carousel-control:hover{transform:translateY(calc(-50% - 2px));border-color:var(--cj-gold,#a7833e);background:var(--cj-green,#405b49);color:#fff}
.latest .carousel-control.prev{left:-18px}.latest .carousel-control.next{right:-18px}
.latest .carousel-dots{gap:10px;padding-top:13px}
.latest .carousel-dots button{width:10px;height:10px;background:var(--cj-gold-light,#e4d6b2);transition:transform .2s ease,background-color .2s ease}
.latest .carousel-dots button[aria-current=true]{background:var(--cj-green,#405b49)}
.latest .carousel-dots button:hover{transform:scale(1.2)}
@media(max-width:900px){.latest .carousel-control.prev{left:5px}.latest .carousel-control.next{right:5px}}
@media(max-width:620px){.latest .article-card--text{min-height:310px}.latest .article-card--text .article-meta{padding:20px 20px 19px}.latest .article-card--text .article-excerpt{-webkit-line-clamp:4;font-size:14px}.latest .carousel-control.prev{left:6px}.latest .carousel-control.next{right:6px}}
@media(prefers-reduced-motion:reduce){.latest .article-card--text,.latest .article-card-more span,.latest .carousel-control,.latest .carousel-dots button{transition:none}}
/* Shared paper panels for homepage explanatory sections */
.home-main .home-paper-panel{max-width:none;padding:clamp(21px,2.5vw,34px);border:1px solid var(--cj-line,#ded8c9);border-radius:8px;background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(250,247,238,.94));box-shadow:0 10px 28px rgba(43,55,45,.055)}
.home-main .home-panel-kicker{margin:0 0 7px;color:var(--cj-gold,#a7833e);font:600 11px/1.5 system-ui,sans-serif;letter-spacing:.19em}
.home-main .home-paper-panel h2{margin:0 0 18px;padding:0 0 13px;border-bottom:1px solid var(--cj-line,#ded8c9);color:var(--cj-green-deep,#405b49);font-size:clamp(27px,2.5vw,36px);font-weight:500;line-height:1.35}
.home-main .home-paper-panel p{line-height:1.72}
.home-main .site-about h3{margin:17px 0 3px;color:var(--cj-green,#405b49);font-size:17px;font-weight:600}
.home-main .site-about>p{margin-bottom:11px;font-size:17px;line-height:1.72}
.home-main .home-paper-panel .feature-actions{margin-top:24px}
.home-main .site-about .support-row{margin-top:23px}
@media(max-width:900px){.home-main .home-paper-panel{padding:25px 24px}.home-main .home-paper-panel h2{font-size:clamp(27px,4vw,34px)}}
@media(max-width:620px){.home-main .home-paper-panel{padding:21px 19px;border-radius:7px}.home-main .home-paper-panel h2{margin-bottom:15px;padding-bottom:11px;font-size:30px}.home-main .home-panel-kicker{font-size:10px}.home-main .site-about .support-row{margin-top:20px;gap:14px}}
/* Keep the tall book cover off narrow phone screens; retain it on tablets and desktops. */
@media(max-width:620px){.hero-book{display:none}}

/* Desktop first fold: keep the full welcome copy and both actions within one viewport. */
@media(min-width:901px){
  body:has(.home-main) .home-main>.hero .hero-grid{align-items:center;gap:clamp(18px,2vw,30px)}
  body:has(.home-main) .home-main>.hero .hero-copy{padding:clamp(18px,2vw,30px)}
  body:has(.home-main) .home-main>.hero .hero-copy h1{margin-bottom:14px;font-size:clamp(40px,4.2vw,60px);line-height:1.13}
  body:has(.home-main) .home-main>.hero .hero-copy .home-copy{font-size:clamp(15px,.92vw,17px);line-height:1.62}
  body:has(.home-main) .home-main>.hero .hero-copy .home-copy p{margin-bottom:12px}
  body:has(.home-main) .home-main>.hero .home-buttons{gap:12px;margin-top:18px}
  body:has(.home-main) .home-main>.hero .home-buttons .home-btn{min-height:48px;padding-top:9px;padding-bottom:9px;font-size:16px}
  body:has(.home-main) .home-main>.hero .home-note{margin-top:14px;font-size:13px;line-height:1.5}
  body:has(.home-main) .home-main>.hero .hero-book{width:auto;height:80svh;max-height:80svh!important;max-width:100%;justify-self:center;object-fit:contain}
}

/* Keep the homepage heading to its intended two lines on phones. */
@media(max-width:620px){
  body:has(.home-main) .home-main .hero h1{font-size:clamp(28px,8vw,34px);line-height:1.2;margin-bottom:15px}
}