/* 內容頁（品牌故事、茄芷袋、企業禮贈）共用：頁首大標 + 一欄閱讀寬度的段落，圖文穿插 */

.page-head { padding: clamp(56px, 8vw, 120px) 0 clamp(40px, 5vw, 72px); }
.page-head h1 { font-size: clamp(34px, 5vw, 64px); line-height: 1.25; }
.page-head .lead { margin-top: 22px; font-size: clamp(17px, 1.5vw, 20px); max-width: 30em; }

.page-hero-img { margin: 0; }
.page-hero-img img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; }
.page-hero-img figcaption { max-width: var(--wrap); margin: 12px auto 0; padding: 0 var(--gutter); font-size: 13px; color: var(--muted); }
@media (max-width: 700px) { .page-hero-img img { aspect-ratio: 4 / 3; } }

/* 文章段落：閱讀寬度 */
.prose { max-width: 720px; }
.prose h2 { font-size: clamp(24px, 2.6vw, 32px); margin-top: clamp(56px, 7vw, 96px); }
.prose h2:first-child { margin-top: 0; }
.prose h3 { font-size: 19px; margin-top: 36px; }
.prose p { margin-top: 18px; font-size: 16.5px; }
.prose ul { margin: 18px 0 0; padding-left: 1.2em; }
.prose li { margin-top: 8px; }
.prose strong { font-weight: 500; background: linear-gradient(transparent 62%, color-mix(in srgb, var(--accent) 35%, transparent) 62%); }

/* 大字引言（願景、使命） */
.quote { margin: clamp(56px, 7vw, 96px) 0 0; padding-left: clamp(18px, 2vw, 28px); border-left: 2px solid var(--accent); }
.quote p { font-family: var(--serif); font-size: clamp(22px, 2.6vw, 32px); line-height: 1.6; margin: 0; }
.quote span { display: block; margin-top: 12px; font-size: 14px; color: var(--muted); letter-spacing: .1em; }

/* 文中圖：一張寬、或兩張並排 */
.inline-img { margin: clamp(40px, 5vw, 64px) 0 0; }
.inline-img img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.inline-img figcaption { margin-top: 10px; font-size: 13px; color: var(--muted); }
.img-pair { margin: clamp(40px, 5vw, 64px) 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.img-pair figure { margin: 0; }
.img-pair img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
@media (max-width: 560px) { .img-pair { grid-template-columns: 1fr; } }

/* 數字三格（真實數字） */
.numbers { margin-top: 36px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.numbers div { background: var(--bg); padding: 22px 20px; }
.numbers b { display: block; font-family: var(--serif); font-size: clamp(28px, 3vw, 40px); font-weight: 600; line-height: 1.15; }
.numbers span { display: block; margin-top: 8px; color: var(--muted); font-size: 14px; }
@media (max-width: 640px) { .numbers { grid-template-columns: 1fr; } }

/* 價值觀：名稱 + 一句話，兩欄 */
.values { margin-top: 32px; display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
.values div { padding: 18px 0; border-top: 1px solid var(--line); }
.values b { font-family: var(--serif); font-size: 19px; font-weight: 600; }
.values p { margin-top: 6px; font-size: 15px; color: var(--muted); }
@media (max-width: 640px) { .values { grid-template-columns: 1fr; } }

/* 常見問題：可展開 */
.faq { margin-top: 28px; border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; list-style: none; padding: 20px 32px 20px 0; position: relative; font-size: 17px; font-weight: 500; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 4px; top: 18px; font-size: 22px; color: var(--muted); }
.faq details[open] summary::after { content: "−"; }
.faq details p { margin: 0 0 22px; color: var(--muted); }

/* 流程：步驟名稱就是標籤，不加「步驟 1」 */
.flow { margin-top: 28px; list-style: none; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); counter-reset: f; }
.flow li { background: var(--bg); padding: 20px 18px; }
.flow b { display: block; font-size: 17px; font-weight: 500; }
.flow span { display: block; margin-top: 6px; font-size: 14px; color: var(--muted); }
@media (max-width: 860px) { .flow { grid-template-columns: 1fr; } }

/* 頁尾行動：一行說明 + 按鈕 */
.page-cta { border-top: 1px solid var(--line); }
.page-cta .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 28px; }
.page-cta h2 { font-size: clamp(24px, 2.6vw, 32px); }
.page-cta .actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* 物件小卡（企業禮贈頁列出可選的商品） */
.mini-objects { margin-top: 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.mini-objects a { text-decoration: none; display: grid; grid-template-columns: 120px 1fr; gap: 18px; align-items: center; }
.mini-objects img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.mini-objects h3 { font-size: 19px; margin: 0; }
.mini-objects p { margin-top: 4px; color: var(--muted); font-size: 14.5px; }
@media (max-width: 640px) { .mini-objects { grid-template-columns: 1fr; } }

/* 合作過的單位：只放名稱，橫排、以分隔線區隔，不用 Logo（需對方授權） */
.partners { list-style: none; padding: 0; margin: 24px 0 0; display: flex; flex-wrap: wrap; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.partners li { margin: 0; padding: 18px 28px 18px 0; margin-right: 28px; font-family: var(--serif); font-size: 18px; border-right: 1px solid var(--line); }
.partners li:last-child { border-right: 0; margin-right: 0; }
@media (max-width: 560px) { .partners { display: block; } .partners li { border-right: 0; margin-right: 0; padding: 14px 0; border-bottom: 1px solid var(--line); } .partners li:last-child { border-bottom: 0; } }
