/* 光明洲實修中心網站。淺色系（業主不用深色）。配色：僧袍深紅＋經幡金；內文明體、介面黑體。 */
:root{
  --bg:#fbfaf8; --paper:#fff; --ink:#2a2420; --muted:#7a716a; --line:#ebe5dc;
  --robe:#7b2330; --robe-dark:#5e1a25; --gold:#a8771c; --gold-ink:#8a6214; --gold-soft:#f5ecd9; --ok:#2f6b4f; --ok-soft:#e6f1ea;
  --serif:"Noto Serif TC","Songti TC","PMingLiU",serif;
  --sans:"Noto Sans TC","PingFang TC","Heiti TC",system-ui,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.8 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:var(--robe)}
.wrap{max-width:1120px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.narrow{max-width:760px}
h1,h2,h3{font-family:var(--serif);text-wrap:balance;line-height:1.35;margin:0}
.nb{display:inline-block;max-width:100%}   /* 標題只在標點後換行 */
/* 標題、目錄、卡片標題只在標點或空格處換行，詞不拆開；真的太長才強制斷 */
h1,h2,h3,.toc a,.card b,.hero .tag{word-break:keep-all;overflow-wrap:anywhere}
.en{font-size:12px;letter-spacing:.18em;color:var(--gold-ink);font-weight:700;margin:4px 0 22px}

/* 頂欄 */
.top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top .in{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1120px;margin:0 auto;padding:10px max(20px,env(safe-area-inset-right,0px)) 10px max(20px,env(safe-area-inset-left,0px))}
.logo{font-family:var(--serif);font-weight:700;font-size:19px;color:var(--robe);text-decoration:none;line-height:1.2}
.logo small{display:block;font:500 10.5px/1.4 var(--sans);letter-spacing:.16em;color:var(--muted)}
nav{display:flex;gap:22px;margin-left:auto;order:1}
nav a{color:var(--ink);text-decoration:none;font-size:15px;line-height:1.2;text-align:center;white-space:nowrap}
nav a small{display:block;font-size:10.5px;letter-spacing:.08em;color:var(--muted)}
nav a:hover{color:var(--robe)}
/* 語言切換（中文／EN）與手機選單按鈕 */
.tools{display:flex;align-items:center;gap:10px;flex-shrink:0;order:2}
.lang{display:inline-flex;border:1.5px solid var(--robe);border-radius:99px;overflow:hidden;font:700 13px/1 var(--sans);white-space:nowrap}
.lang>*{padding:6px 11px;min-width:34px;text-align:center}
.lang .on{background:var(--robe);color:#fff}
.lang a{color:var(--robe);text-decoration:none}
.lang a:hover{background:var(--gold-soft)}
.lang a:focus-visible{outline:3px solid var(--gold);outline-offset:-3px}
.menu-btn{display:none;background:var(--robe);color:#fff;border:0;border-radius:99px;padding:6px 14px;font:700 14px var(--sans);white-space:nowrap}
@media (max-width:860px){
  .menu-btn{display:block}
  nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:6px 20px 14px}
  nav.open{display:flex}
  nav a{text-align:left;padding:10px 0;border-bottom:1px solid var(--line)}
}

/* 按鈕與標籤 */
.btn{display:inline-block;background:var(--robe);color:#fff;text-decoration:none;border-radius:99px;padding:9px 22px;font-weight:700;font-size:15px;border:2px solid var(--robe)}
.btn:hover{background:var(--robe-dark);border-color:var(--robe-dark)}
.btn.ghost{background:transparent;color:var(--robe)}
.btn.ghost:hover{background:var(--robe);color:#fff}
.btn:focus-visible,.card:focus-visible,.chip:focus-visible,nav a:focus-visible,.menu-btn:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.pill{display:inline-block;font-size:12px;font-weight:700;border-radius:99px;padding:1px 10px;margin-top:8px}
.pill.open{background:var(--ok-soft);color:var(--ok)} .pill.done{background:#efece7;color:#665e57}   /* 小字對比要 ≥ 4.5 */

/* 首頁主視覺：照片照原比例，不裁切 */
.hero{padding:48px 0 40px}
.hero-in{display:grid;grid-template-columns:1fr 1.05fr;gap:44px;align-items:center}
.hero h1{font-size:clamp(34px,5vw,52px);color:var(--ink)}
.hero .sub{font-family:var(--serif);font-size:20px;color:var(--muted);margin:6px 0 18px}
.hero .tag{font-family:var(--serif);font-size:clamp(20px,2.4vw,26px);line-height:1.6;color:var(--robe);font-weight:700;margin:0 0 14px}
.hero p{font-family:var(--serif);font-size:18px;line-height:1.9;max-width:30em}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.hero .ph{margin:0;border-radius:6px;overflow:hidden;box-shadow:0 14px 40px rgba(60,30,20,.14)}
@media (max-width:860px){.hero-in{grid-template-columns:1fr}.hero .ph{order:-1}}

/* 區段 */
.sec{padding:56px 0}
.sec.alt{background:#f4f0ea}
.sec h1,.sec h2{font-size:clamp(26px,3.4vw,34px)}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.more{color:var(--robe);font-weight:700;text-decoration:none;margin-bottom:22px}
.sec p{max-width:40em}

/* 卡片：圖框固定比例，圖片整張放進去（contain），不裁到臉、頭或海報文字 */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px}
.card{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:8px;overflow:hidden;text-decoration:none;color:var(--ink);height:100%;transition:transform .25s ease,box-shadow .25s ease}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(60,30,20,.10)}
.card .im{aspect-ratio:4/3;background:#efe9e0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.card .im img{width:100%;height:100%;max-height:100%;object-fit:contain}
.card .im.empty{background:linear-gradient(135deg,#efe6d6,#e9dccb)}
.card .bd{padding:14px 16px 18px}
.card b{display:block;font-family:var(--serif);font-size:17px;line-height:1.5}
.card small{display:block;color:var(--muted);font-size:14px;line-height:1.6;margin-top:6px}
.cw[hidden]{display:none}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:-6px 0 24px}
.chip{border:1.5px solid var(--line);background:#fff;border-radius:99px;padding:4px 14px;font:500 14px var(--sans);color:var(--ink);cursor:pointer}
.chip.on{background:var(--robe);border-color:var(--robe);color:#fff}

/* 過去活動：小三角形收起來 */
details.past{margin-top:40px;border-top:1px solid var(--line);padding-top:18px}
details.past summary{cursor:pointer;font-family:var(--serif);font-size:20px;font-weight:700;color:var(--muted);list-style:none;display:flex;align-items:center;gap:10px}
details.past summary::-webkit-details-marker{display:none}
details.past summary::before{content:"";border:7px solid transparent;border-left-color:var(--robe);border-right:0;transition:transform .2s}
details.past[open] summary::before{transform:rotate(90deg)}
details.past summary small{font:700 12px var(--sans);letter-spacing:.16em;color:var(--gold-ink)}
details.past .cards{margin-top:22px}

/* 指導上師：直幅照片照原比例 */
.two{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:48px;align-items:center}
.portrait{margin:0;border-radius:6px;overflow:hidden}
.two.line-oa{grid-template-columns:1fr minmax(0,500px)}
.two.sup-intro{grid-template-columns:1fr minmax(0,300px)}
.callig{margin:0}.callig img{border-radius:4px;box-shadow:0 10px 30px rgba(60,30,20,.10)}
/* 護持方案：兩張卡片並排，手機一欄 */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;margin-top:28px}
.plan{background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--gold);border-radius:8px;padding:22px 24px 24px;display:flex;flex-direction:column}
.plan h3{font-size:22px;color:var(--robe);margin-bottom:10px}
.plan ul{margin:0 0 20px;padding-left:1.2em;line-height:1.9;flex:1}
.plan .btn{align-self:flex-start}
/* 每月供燈：單次報名，和長期護持分開，不做成第三張卡片 */
.grp{font-size:20px;color:var(--robe);margin-top:36px}
.grp+.plans{margin-top:16px}
.lamp{margin-top:36px;padding:22px 24px;border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:8px;background:var(--paper)}
.lamp h3{font-size:20px;color:var(--robe);margin-bottom:8px}
.lamp p{margin:0 0 8px;line-height:1.9}
.lamp p:last-child{margin:14px 0 0;display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center}
.lamp .more{margin:0}
.line-oa .oa{border-radius:6px;box-shadow:0 10px 30px rgba(60,30,20,.10);margin-bottom:16px}
@media (max-width:760px){.two,.two.line-oa,.two.sup-intro{grid-template-columns:1fr}.callig{max-width:320px}.portrait{max-width:360px}}

/* 文章頁 */
.article{padding:40px 0 70px}
.art{display:grid;grid-template-columns:220px minmax(0,1fr);gap:48px}
.toc{position:sticky;top:90px;align-self:start;font-size:14px;border-right:1px solid var(--line);padding-right:18px}
.toc b{display:block;font-size:12.5px;letter-spacing:.08em;margin-bottom:8px}
.toc a{display:block;color:var(--muted);text-decoration:none;padding:5px 0;line-height:1.5}
.toc a:hover,.toc a.on{color:var(--robe)}
.toc:empty{display:none}
.art:has(.toc:empty){grid-template-columns:minmax(0,1fr)}
.art:has(.toc:empty) .body{margin:0 auto}
.body{max-width:40em}
.crumb{font-size:14px;color:var(--muted)} .crumb a{color:var(--muted)}
.article h1{font-size:clamp(28px,4vw,38px);margin:10px 0 8px}
.by{color:var(--muted);font-size:15px;margin-bottom:28px}
.by .pill{margin:0 0 0 10px;vertical-align:middle}
.ev-sum{font-family:var(--serif);font-size:18px;margin:-14px 0 16px}
.ev-btns{margin:0 0 30px}
.body p{font-family:var(--serif);font-size:18px;line-height:2;margin:0 0 16px}
.body h2.sess{font-size:23px;border-left:5px solid var(--gold);padding-left:14px;margin:44px 0 14px;scroll-margin-top:90px}
.body h3.label{font-size:15px;font-family:var(--sans);letter-spacing:.06em;color:var(--muted);margin:52px 0 4px}
.body h3.sub{font-size:19px;color:var(--robe);margin:30px 0 8px}
.body p.q{font-family:var(--sans);font-style:italic;color:var(--muted);border-left:2px solid var(--line);padding-left:14px}
.body figure{margin:24px 0}
.body figcaption{font-size:14px;color:var(--muted);margin-top:6px}
/* 活動花絮：連續照片排兩欄，每張照原比例（不裁切） */
.gallery{columns:2;column-gap:12px;margin:24px 0}   /* 瀑布流：直幅橫幅混排不留空洞 */
.gallery figure{margin:0 0 12px;break-inside:avoid}
.gallery img{border-radius:4px}
@media (max-width:520px){.gallery{columns:1}}
.tbl{overflow-x:auto;margin:20px 0}
.tbl table{border-collapse:collapse;width:100%;font-size:16px;line-height:1.7}
.tbl th,.tbl td{border:1px solid var(--line);padding:8px 12px;text-align:left;vertical-align:top}
.tbl th{background:var(--gold-soft);font-weight:700;white-space:nowrap}
.body hr{border:0;border-top:1px solid var(--line);margin:40px 0}
.body blockquote,.body .callout{margin:20px 0;padding:14px 18px;background:var(--gold-soft);border-radius:6px}
.body ul,.body ol{font-family:var(--serif);font-size:17px;line-height:1.9}
@media (max-width:860px){.art{grid-template-columns:1fr}.toc{position:static;border-right:0;border-bottom:1px solid var(--line);padding:0 0 12px}.toc:has(b){display:block}}

/* 頁尾 */
.foot{background:#efe9e0;color:var(--ink);border-top:1px solid var(--line);padding:34px 0;font-size:14px;line-height:1.9}
.foot .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.foot a{color:var(--robe)}
.foot .links{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.foot .links .btn{color:#fff;font-size:14px;padding:6px 18px}
.social{display:flex;gap:10px}
.si{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--line);color:var(--robe)}
.si svg{width:18px;height:18px}
.si:hover{background:var(--robe);color:#fff;border-color:var(--robe)}
.si:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* 滑動時的小轉場：只有 JS 開起來才先隱藏，JS 失敗時內容照常顯示 */
.js .rv{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease;transition-delay:var(--d,0s)}
.js .rv.in{opacity:1;transform:none}
@media print{.js .rv{opacity:1;transform:none}.top,.toc,.foot .links{display:none}}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}.card,.card:hover{transition:none;transform:none}html{scroll-behavior:auto}}
.btns .more{margin:0;align-self:center}   /* 主按鈕旁的次要文字連結 */
@media (max-width:860px){ html[lang="en"] .logo{font-size:16px} }   /* 英文站名較長，手機上不要擠成三行 */

/* 活動頁資訊卡：日期、時間、地點、狀態與報名按鈕 */
.evinfo{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--robe);border-radius:8px;padding:16px 20px;margin:0 0 30px}
.evinfo dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 24px;margin:0}
.evinfo dt{font-size:12px;letter-spacing:.12em;color:var(--gold-ink);font-weight:700}
.evinfo dd{margin:2px 0 0;font-size:16px}
.evinfo dd .pill{margin:0}
.evinfo .btns{margin-top:14px}
/* 文字連結的鍵盤焦點也要看得見 */
a:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:2px}
@media (max-width:760px){
  /* 類別標籤：手機上排成一行橫向捲動，類別變多也不會越疊越高 */
  .chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-16px;padding:2px 16px 4px 2px}
  .chips::-webkit-scrollbar{display:none}
  .chip{flex:0 0 auto}
  /* 手機內文：17px、行高 1.85 */
  .body p{font-size:17px;line-height:1.85}
  /* 頁尾：加入 LINE 放最上面當主要動作 */
  .foot .links{order:-1}
}