/* =========================================================
   大武山成年禮｜全站質感疊加層 v1（2026-10-15）
   定位：疊在 tawu-refine-v1.css 之後，只做「細節的一致性與動態的節奏」，不動文字內容。
   原則：克制、溫潤；一切動態都只用 opacity／transform，並尊重「減少動態」設定。
   內容：圓角三級制、標題進場、段落錯落淡入、
         卡片與按鈕互動、FAQ 展開、跨頁淡入轉場、焦點樣式、紙面頁首的等高線底紋。
   ========================================================= */

:root{
  --r-photo:18px;   /* 照片、結語大卡、上下頁導覽 */
  --r-card:14px;    /* 一般內容卡 */
  --r-tile:10px;    /* 小方塊（裝備格、成果格） */
  --t-dawn:#c4974a;
  --t-ease:cubic-bezier(.22,.7,.12,1);
  interpolate-size:allow-keywords;
}

/* 補字：「贊」（協辦與贊助單位）不在原本的內嵌字型子集內，另以三個極小的字型檔補上，其他字不受影響 */
@font-face{font-family:"TAWU Embedded";src:url("/assets/fonts/extra-zan-sans-400-v1.woff2") format("woff2");font-style:normal;font-weight:100 600;font-display:swap;unicode-range:U+8D0A}
@font-face{font-family:"TAWU Embedded";src:url("/assets/fonts/extra-zan-sans-700-v1.woff2") format("woff2");font-style:normal;font-weight:700 900;font-display:swap;unicode-range:U+8D0A}
@font-face{font-family:"Source Han Serif TC Embedded";src:url("/assets/fonts/extra-zan-serif-700-v1.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap;unicode-range:U+8D0A}
@font-face{font-family:"TAWU Embedded";src:url("/assets/fonts/extra-ritual-sans-400-v1.woff2") format("woff2");font-style:normal;font-weight:100 600;font-display:swap;unicode-range:U+56CA,U+616E,U+6490,U+67F4,U+6CE5,U+6E3A,U+6EF4,U+6F2B,U+754F,U+8DE1,U+905C,U+908A,U+53EC,U+5E95,U+6DEC,U+934A}
@font-face{font-family:"Source Han Serif TC Embedded";src:url("/assets/fonts/extra-ritual-serif-700-v1.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap;unicode-range:U+754F}
@font-face{font-family:"TAWU Embedded";src:url("/assets/fonts/extra-origins-sans-400-v1.woff2") format("woff2");font-style:normal;font-weight:100 600;font-display:swap;unicode-range:U+51DD,U+5269,U+5F31,U+5FA9,U+62B1,U+6478,U+6625,U+6BC5,U+6F88,U+734E,U+76C3,U+7834,U+7AF6,U+7D22,U+810A,U+8A72,U+8CEA,U+8CFD,U+8EDF,U+8F29,U+93E1,U+9678}
@font-face{font-family:"TAWU Embedded";src:url("/assets/fonts/extra-origins-sans-700-v1.woff2") format("woff2");font-style:normal;font-weight:700 900;font-display:swap;unicode-range:U+810A}
@font-face{font-family:"Source Han Serif TC Embedded";src:url("/assets/fonts/extra-origins-serif-700-v1.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap;unicode-range:U+51DD,U+76F4,U+810A,U+86FB,U+8E29}
@font-face{font-family:"TAWU Embedded";src:url("/assets/fonts/extra-journey-sans-400-v1.woff2") format("woff2");font-style:normal;font-weight:100 600;font-display:swap;unicode-range:U+4F0F,U+4F10,U+50BE,U+52DD,U+547C,U+5598,U+5C01,U+5F91,U+5F92,U+6253,U+62FE,U+6399,U+654F,U+6975,U+6A9C,U+6D41,U+6DE1,U+6ECB,U+7259,U+78E8,U+7960,U+7A1C,U+817F,U+8180,U+840C,U+8C37,U+8E29,U+901E,U+9298,U+92B3,U+9375,U+96F2,U+97CC}
@font-face{font-family:"TAWU Embedded";src:url("/assets/fonts/extra-journey-sans-700-v1.woff2") format("woff2");font-style:normal;font-weight:700 900;font-display:swap;unicode-range:U+5438,U+547C,U+5BE9,U+78E8,U+8A17,U+908A}
@font-face{font-family:"Source Han Serif TC Embedded";src:url("/assets/fonts/extra-home-serif-700-v1.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap;unicode-range:U+514B,U+5FD7}
@font-face{font-family:"TAWU Embedded";src:url("/assets/fonts/extra-home-sans-400-v1.woff2") format("woff2");font-style:normal;font-weight:100 600;font-display:swap;unicode-range:U+4E08,U+4E99,U+516B,U+51E1,U+55A7,U+56C2,U+57CE,U+5CB3,U+5CF6,U+5DBA,U+5DBC,U+5E02,U+5E55,U+5FFD,U+63A0,U+6495,U+6670,U+66C6,U+6A39,U+6B0A,U+6BEB,U+6C72,U+6C88,U+7126,U+7A97,U+7AEF,U+7C64,U+7FE0,U+87A2,U+8B02}
@font-face{font-family:"TAWU Embedded";src:url("/assets/fonts/extra-vegan-sans-400-v1.woff2") format("woff2");font-style:normal;font-weight:100 600;font-display:swap;unicode-range:U+6750,U+7D20,U+8339}
@font-face{font-family:"TAWU Embedded";src:url("/assets/fonts/extra-vegan-sans-700-v1.woff2") format("woff2");font-style:normal;font-weight:700 900;font-display:swap;unicode-range:U+7D20,U+8339}
@font-face{font-family:"Source Han Serif TC Embedded";src:url("/assets/fonts/extra-vegan-serif-700-v1.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap;unicode-range:U+8339}
@font-face{font-family:"Noto Sans TC Embedded";src:url("/assets/fonts/extra-prep-sans-400-v1.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap;unicode-range:U+627F,U+6CE8}
@font-face{font-family:"Noto Sans TC Embedded";src:url("/assets/fonts/extra-prep-sans-700-v1.woff2") format("woff2");font-style:normal;font-weight:700 900;font-display:swap;unicode-range:U+6CE8}

/* ---------- 基礎：錨點不被頁首遮住、細捲軸、點擊高亮 ---------- */
html{scroll-padding-top:88px;scrollbar-width:thin;scrollbar-color:rgba(20,58,48,.38) transparent}
@media (max-width:480px){html{scroll-padding-top:76px}}
body{-webkit-tap-highlight-color:rgba(196,151,74,.18);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

/* ---------- 圓角三級制：18／14／10 ---------- */
:root body .card,:root body .support-card,:root body .data-group,:root body .choice,
:root body .why-item,:root body .culture-card,:root body .fact,:root body .pstage,
:root body .team-card,:root body .faq-list details{border-radius:var(--r-card)}
:root body .key-tile,:root body .outcome{border-radius:var(--r-tile)}
:root body .point{border-radius:8px}
:root body .page-nav-card,:root body .page-nav-card.previous{border-radius:var(--r-photo)}

main:focus{outline:none}

/* ---------- 跳到主要內容（只有鍵盤聚焦時才出現） ---------- */
.tawu-skip{position:fixed;left:16px;top:-120px;z-index:2147483001;padding:12px 20px;border-radius:999px;
  background:#143a30;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 14px 34px -14px rgba(0,0,0,.55);
  transition:top .35s var(--t-ease)}
.tawu-skip:focus{top:14px;outline:2px solid var(--t-dawn);outline-offset:3px}

/* ---------- 焦點樣式：沒有自訂樣式的元件，一律補上金色外框 ---------- */
:where(a,button,summary,[tabindex]):focus-visible{outline:2px solid var(--t-dawn);outline-offset:3px}

/* ---------- 內文連結：細底線、與文字保持呼吸距離 ---------- */
:root body main p a,:root body footer a{text-decoration-thickness:1px;text-underline-offset:.24em;
  transition:color .3s var(--t-ease),text-decoration-color .3s}
:root body main p a:hover,:root body footer a:hover{text-decoration-color:var(--t-dawn)}

/* ---------- 紙面開場（緣起、活動、團隊）：淡淡的等高線與晨光，與深色頁面同一個地形語彙 ---------- */
:root body section.opening{position:relative;isolation:isolate}
:root body section.opening::before,:root body section.opening::after{content:"";position:absolute;pointer-events:none;z-index:-1}
:root body section.opening::before{inset:0;background:rgba(150,118,62,.062);
  -webkit-mask:url("/assets/contours.svg") 70% 40%/cover no-repeat;mask:url("/assets/contours.svg") 70% 40%/cover no-repeat}
:root body section.opening::after{inset:0;
  background:radial-gradient(46% 72% at 84% 18%,rgba(232,186,118,.16),transparent 70%)}

/* ---------- 互動：卡片、按鈕、連結統一節奏（只作用在「可點」的東西） ---------- */
:root body .support-card{transition:transform .6s var(--t-ease),box-shadow .6s var(--t-ease),border-color .4s}
:root body .support-card:hover{border-color:rgba(196,151,74,.6);box-shadow:0 22px 38px -28px rgba(92,66,30,.5)}
:root body .social-link{transition:background .4s var(--t-ease),border-color .4s,transform .6s var(--t-ease)}
:root body .social-link:hover{border-color:rgba(236,204,150,.7);transform:translateY(-2px)}
:root body .reading-link{transition:background .4s var(--t-ease),transform .6s var(--t-ease),box-shadow .6s var(--t-ease)}
:root body .reading-link:hover{box-shadow:0 18px 30px -18px rgba(20,58,48,.6)}
:root body .mail-btn{transition:background .4s var(--t-ease),transform .5s var(--t-ease)}
:root body .mail-btn:hover{transform:translateY(-1px)}
:root body .intro-scroll{transition:opacity .4s,transform .6s var(--t-ease)}

/* ---------- FAQ：＋／－ 改為細線繪製的十字，展開時直線收起；內容平順展開 ---------- */
:root body .faq-list summary{transition:color .35s var(--t-ease),background .35s var(--t-ease)}
:root body .faq-list summary:hover{background:rgba(196,151,74,.07)}
:root body .faq-list summary::after,:root body .faq-list details[open] summary::after{content:"";right:24px;top:50%;width:14px;height:14px;margin-top:-7px;
  font-size:0;color:var(--accent,#9c4f30);
  background:linear-gradient(currentColor,currentColor) center/100% 1.5px no-repeat,linear-gradient(currentColor,currentColor) center/1.5px 100% no-repeat;
  transition:background-size .5s var(--t-ease),transform .5s var(--t-ease)}
:root body .faq-list details[open] summary::after{background-size:100% 1.5px,1.5px 0;transform:rotate(180deg)}
:root body .faq-list details{transition:border-color .4s var(--t-ease),box-shadow .5s var(--t-ease)}
:root body .faq-list details[open]{border-color:rgba(196,151,74,.5);box-shadow:0 22px 40px -32px rgba(92,66,30,.45)}
@supports selector(::details-content){
  :root body .faq-list details::details-content{block-size:0;overflow:hidden;transition:block-size .55s var(--t-ease),content-visibility .55s allow-discrete}
  :root body .faq-list details[open]::details-content{block-size:auto}
}

/* ---------- 手機選單：展開時輕輕浮出 ---------- */
:root body .tawu-mobile-menu[open] .tawu-mobile-panel{animation:tawu-pop .42s var(--t-ease) backwards;transform-origin:100% 0}
@keyframes tawu-pop{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}


/* ---------- 頁首：不透明度略提高，避免下方文字隱約透出 ---------- */
:root body .tawu-site-header{background:rgba(251,250,246,.975)}
:root body.tawu-scrolled .tawu-site-header{background:rgba(251,250,246,.965);backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15)}

/* ---------- 小字下限：說明、頁尾與圖說不低於 12–13px，手機也好讀 ---------- */
:root body figcaption,:root body .poster-cap{font-size:max(13px,1em)}
:root body figcaption{font-size:13px}
:root body .site-footer-note,:root body .tawu-desktop-toggle,:root body .video-hero-credit{font-size:12px}
:root body .why-item span{font-size:14px}
:root body .point{font-size:13.5px}

/* =========================================================
   動態（只在使用者未要求減少動態時啟用）
   ========================================================= */
@media (prefers-reduced-motion:no-preference){

  /* 內頁標題：進入畫面時，各句由下方微微升起（整體仍是淡入） */
  html.tawu-js .reveal h2 .tawu-phrase{transition:transform 1.3s var(--t-ease)}
  html.tawu-js .reveal:not(.show) h2 .tawu-phrase{transform:translateY(.3em)}
  html.tawu-js .reveal h2 .tawu-phrase:nth-child(2){transition-delay:.1s}
  html.tawu-js .reveal h2 .tawu-phrase:nth-child(3){transition-delay:.2s}

  /* 同一列的區塊依序淡入（--tawu-d 由 tawu-polish-v1.js 依版面位置寫入） */
  :root body .reveal{transition:opacity 1s var(--t-ease) var(--tawu-d,0s)}
  html.tawu-first .reveal{transition:none!important}

  /* 跨頁轉場：換頁時內容柔和交融，頁首固定不閃動（支援的瀏覽器才會啟用） */
  @view-transition{navigation:auto}
  .tawu-site-header{view-transition-name:tawu-header}
  ::view-transition-old(tawu-header){display:none}
  ::view-transition-group(tawu-header){animation-duration:0s}
  ::view-transition-old(root){animation:tawu-vt-out .26s ease both}
  ::view-transition-new(root){animation:tawu-vt-in .6s var(--t-ease) both}
  @keyframes tawu-vt-out{to{opacity:0}}
  @keyframes tawu-vt-in{from{opacity:0}}
}

/* 減少動態：關掉所有進場與轉場，內容直接顯示 */
@media (prefers-reduced-motion:reduce){
  :root body .tawu-mobile-menu[open] .tawu-mobile-panel{animation:none}
  :root body .faq-list summary::after,:root body .faq-list details::details-content{transition:none}
}

/* ---------- 聯絡頁：主辦與策劃下方的「協辦與贊助單位」備註（橫跨兩欄） ---------- */
:root body .data-group-note{grid-column:1/-1}
:root body .data-group-note p{margin:0;font-size:.95rem;line-height:1.95;color:#425149}

/* ---------- 聯絡頁：主辦單位標誌（屏東縣政府、農業部林業及自然保育署屏東分署；已去背） ---------- */
:root body .data-list li.org{display:inline-flex;align-items:center;gap:8px;padding:7px 12px 7px 8px}
:root body .data-list li.org img{display:block;flex:none;width:auto;height:24px;object-fit:contain}


/* 版面微調：緣起兩張照片等寬；活動第三階段照片與文字欄等高；聯絡信箱與電話同字級 */
@media(min-width:901px){:root body .gallery{grid-template-columns:1fr 1fr}}
:root body .gallery .content-photo{display:flex;flex-direction:column}
:root body .gallery .content-photo img{height:auto;aspect-ratio:16/9;flex:none}
:root body .gallery .content-photo figcaption{flex:1}
@media(min-width:901px){
:root body .formal .stage-grid-photo{align-items:stretch}
:root body .formal .stage-photo{display:flex;flex-direction:column}
:root body .formal .stage-photo img{flex:1 1 0;height:0;min-height:0}
}
:root body .mail-addr:not(.phone-num){font-size:15px;font-weight:600;letter-spacing:.01em}
:root body .support-card-mail .mail-btn{min-height:0;padding:0 14px;align-self:stretch}

/* 回顧頁影片區：下滑指引置於影片最下方；YouTube 連結移到右下角 */
:root body .video-hero-scroll{position:absolute;left:0;right:0;bottom:46px;z-index:2;margin:0;padding:0 16px;text-align:center;color:#fff;font-size:1rem}
:root body .video-hero-link{left:auto;right:20px;bottom:14px;transform:none}
@media(max-width:820px){
:root body .video-hero-scroll{bottom:88px}
:root body .video-hero-link{left:50%;right:auto;bottom:42px;transform:translateX(-50%)}
}
/* 回顧頁影片區高度扣掉黏性頁首，讓底部指引與連結在進入頁面時就看得到 */
:root body .video-hero{min-height:calc(100svh - 73px)}
@media(max-width:480px){:root body .video-hero{min-height:calc(100svh - 65px)}}

/* 緣起頁時間軸：由腳本控制「線條到底 → 下一段光點才亮」 */
:root body .tawu-tl-js .time-story::after{animation:none;transform:scaleY(var(--tl-p,0))}
:root body .tawu-tl-js .time-story::before{animation:none;background:#f3ece0;box-shadow:0 0 0 0 rgba(200,157,85,0);transition:background .6s var(--t-ease,ease),box-shadow .6s var(--t-ease,ease)}
:root body .tawu-tl-js .time-story.is-lit::before{background:#c89d55;box-shadow:0 0 0 6px rgba(200,157,85,.18)}

/* 活動頁「階段訓練，形成團隊默契」標題下方照片 */
:root body .why-photo{margin:34px 0 0}
:root body .why-photo img{height:auto;aspect-ratio:3/2;object-fit:cover}
/* 活動頁「走完這段路…」：照片移到右側，欄寬對調 */
@media(min-width:901px){:root body .legacy-box{grid-template-columns:1.25fr .75fr}}

/* 緣起頁「大武山腳下的約定」：第二段第一句獨立成行、以宋體粗體強調 */
:root body .cov-lede{display:block;margin-bottom:.35em;font-family:"Source Han Serif TC Embedded","TAWU Embedded","Noto Serif TC",serif;font-weight:700;font-size:1.2em;line-height:1.7;color:var(--pine);letter-spacing:.04em}
:root body .birth .section-head>div:last-child>p+p{margin-top:1em}
:root body .legacy-box p+p{margin-top:1em}
:root body .turning-copy .quote{background:none;box-shadow:none;border-radius:0;padding:0;color:var(--pine);margin:22px 0}
:root body .story .section-head p+p{margin-top:1em}
:root body .culture-photo{margin:28px 0 0;border-radius:18px;overflow:hidden;background:#173f35;box-shadow:var(--shadow)}
:root body .culture-photo img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 60%}
@media(min-width:701px){:root body .culture-photo img{aspect-ratio:2/1}}
:root body .why-closing{margin:26px 0 30px;font-size:17px;line-height:1.95;color:#56655f}

:root body .why-head{margin-bottom:34px}
:root body .why-head h2{margin-bottom:0}
:root body .why-grid{align-items:stretch}
:root body .why-left{display:flex;flex-direction:column}
:root body .why-lead{margin:0 0 1em;font-size:17px;line-height:1.95;color:#56655f}
:root body .why-left .why-closing{margin:0 0 30px}
:root body .why-left .why-photo{margin:auto 0 0}
:root body .why-list{display:flex;flex-direction:column;gap:12px}
:root body .why-list .why-item{flex:1;align-items:center}
@media(max-width:900px){:root body .why-left .why-photo{margin-top:6px}:root body .why-list .why-item{flex:none}}

/* 聯絡頁：Facebook／Instagram 圖示（去背） */
.soc-ico{display:block;flex:none;width:28px;height:28px;object-fit:contain}
:root body .support-card strong{display:flex;align-items:center;gap:11px}
:root body .support-card strong .soc-ico{width:30px;height:30px}
:root body .social-link{gap:10px}
:root body .social-link .soc-ico{width:24px;height:24px}

/* 楔子：副標與前四幕長文改用標題同款思源宋體（內文 400、重點句 700；小標 eyebrow 維持原字體） */
:root body .pl-t,:root body .pl-t *,:root body .pl-q,:root body .pl-q *,:root body .pl-end,:root body .pl-end *{font-family:"Source Han Serif TC Embedded","PMingLiU","Noto Serif TC",serif!important;font-weight:400!important}
:root body .pl-q,:root body .pl-q *,:root body .pl-end,:root body .pl-end *,:root body .pl-hl,:root body .pl-hl *{font-weight:700!important}

/* 楔子 hero：小標 eyebrow 與副標改為粗體宋體（同大標題） */
:root body.page-home .eyebrow,:root body.page-home .hero-lead{font-family:"Source Han Serif TC Embedded","PMingLiU","Noto Serif TC",serif!important;font-weight:700!important}

/* Safari（含 iPhone）：refine 層對內文設的 text-wrap:pretty 會被 WebKit 套到「整段」，
   使每行都被縮短、段落只靠左一側。只在 Safari 取消，內文行滿版；Chrome／Android 維持原狀。 */
@supports (hanging-punctuation:first){
  :root body p,:root body li,:root body figcaption,:root body dd{text-wrap:wrap}
}

/* 全站內文左右對齊（Ken 指示）：段落、清單項目、說明文字一律 justify；
   本來就置中的結語／引言／圖說（下方例外清單）維持置中；hero 副標與楔子問句維持靠左。 */
:root body main :is(p,li,dd,figcaption){text-align:justify;text-justify:auto}
html[lang|="en"] body main :is(p,li,dd,figcaption){hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}
:root body main :is(.pl-center,.pl-end,.closing-box p,.register-box p,.key-tile figcaption,.pack-pair figcaption,.social p,.page-home #ritual .section-head p,.origin-closing,.team-quote,.team-pass,.hint,.description){text-align:center}
:root body main :is(.hero-lead,.pl-q,.origin-pull,.quote p){text-align:left}

/* 2026-10-16 第24版：標題宋體、手機斷句、靠左例外 */
:root body .meaning-card b,:root body .outcome b{font-family:"Source Han Serif TC Embedded","PMingLiU","Noto Serif TC",serif!important;font-weight:700!important}
:root body main .pl-2 .pl-t:nth-of-type(3),:root body main .closing-line{text-align:left}
@media(max-width:820px){
  /* 迴響頁兩個標題：手機版固定兩行（第一行短句，第二行整句），字級依視窗寬度縮放 */
  :root body .section-title.tfit{font-size:clamp(20px,calc((100vw - 28px)/13.6),34px)}
  /* 迴響頁結語：手機版四行，每行一個完整斷句 */
  :root body .conclusion-box .closing-line{font-size:clamp(13px,calc((100vw - 82px)/17.6),25px)!important;letter-spacing:0}
}
