/* ===== 春嶺蜜境 共用樣式 Spring Ridge Honey ===== */
:root{
  /* ── 品牌主色(取自春嶺蜜境 VI 系統)── */
  --green:#0D1C0F;   /* 品牌深墨綠 */
  --gold:#C1A45E;    /* 品牌金 */
  --ivory:#E7DBC7;   /* 品牌米白 */
  --brown:#231916;   /* 品牌深棕(單色版) */
  /* ── 衍生階調 ── */
  --amber:#D4BA7E;   /* 金・亮階 */
  --cream:#F6F1E7;   /* 頁面底色 */
  --paper:#EFE7D8;   /* 次級區塊底 */
  --clay:#8C6B34;    /* 金・深階(價格強調) */
  --ink:#0D1C0F;     /* 內文／導覽文字：沿用品牌深墨綠 */
  --muted:#5C5647;
  --radius:6px;    /* 按鈕統一圓角 */
  --green-soft:#1B3A1E;              /* 墨綠亮階：深色按鈕 hover */
  --hairline:rgba(193,164,94,.45);   /* 品牌金 45%：細框線 */
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Noto Sans TC',sans-serif;color:var(--ink);background:var(--cream);line-height:1.8;}
h1,h2,h3,h4,.serif{font-family:'Noto Serif TC','Playfair Display',serif;}
.en{font-family:'Playfair Display',serif;font-style:italic;letter-spacing:.05em;color:var(--gold);}
a{text-decoration:none;color:inherit;}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px;}
header.transparent :focus-visible{outline-color:var(--amber);}
img{max-width:100%;display:block;}
.container{max-width:1140px;margin:0 auto;padding:0 24px;}
.narrow{max-width:820px;}
.section{padding:100px 0;}
.center{text-align:center;}
.section-label{display:flex;align-items:center;gap:14px;margin-bottom:18px;}
.section-label.center{justify-content:center;}
.section-label .line{width:40px;height:1px;background:var(--gold);}
.section-label span{font-size:13px;letter-spacing:.25em;color:var(--gold);text-transform:uppercase;}
.section h2{font-size:34px;font-weight:700;margin-bottom:16px;color:var(--green);}
.lead{max-width:580px;margin:0 auto 56px;color:var(--muted);font-size:15px;text-align:center;}

/* ===== NAV ===== */
header.site-nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:14px 48px;transition:.4s;}
header.site-nav.solid,header.site-nav.scrolled{background:var(--cream);box-shadow:0 2px 16px rgba(0,0,0,.06);}
header.site-nav.transparent{background:linear-gradient(to bottom, rgba(13,28,15,.62), rgba(13,28,15,.20) 60%, transparent);}
header.transparent .logo,header.transparent nav a{color:#fff;}
header.scrolled .logo,header.scrolled nav a,header.solid .logo,header.solid nav a{color:var(--ink);}
.logo{display:flex;align-items:center;line-height:0;}
.logo .mark{height:60px;width:auto;flex:0 0 auto;}
.logo .word{height:60px;width:auto;}
.logo .word-light{display:none;}
header.transparent .logo .word-light{display:block;}
header.transparent .logo .word{filter:drop-shadow(0 1px 10px rgba(13,28,15,.85));}
header.transparent .logo .word-ink{display:none;}
.site-nav nav{display:flex;gap:30px;align-items:center;}
.site-nav nav a{font-size:14px;letter-spacing:.05em;position:relative;}
.site-nav nav a::after{content:'';position:absolute;left:0;bottom:-6px;width:0;height:1px;background:var(--gold);transition:.3s;}
.site-nav nav a:hover::after,.site-nav nav a.active::after{width:100%;}
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;
  width:42px;height:42px;padding:0;background:none;border:0;cursor:pointer;color:var(--ink);}
.nav-toggle span{display:block;width:22px;height:1.5px;background:currentColor;transition:.3s;}
header.transparent .nav-toggle{color:#fff;}
body.menu-open .nav-toggle span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
body.menu-open .nav-toggle span:nth-child(2){opacity:0;}
body.menu-open .nav-toggle span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}
.nav-cta{border:1px solid var(--gold);color:var(--gold)!important;padding:8px 20px;border-radius:var(--radius);font-size:13px;transition:background .25s,color .25s,border-color .25s;}
.transparent .nav-cta{border-color:var(--amber);color:var(--amber)!important;}
.nav-cta:hover,.nav-cta:focus-visible{background:var(--gold);color:#fff!important;}
.transparent .nav-cta:hover,.transparent .nav-cta:focus-visible{background:var(--amber);border-color:var(--amber);color:var(--green)!important;}

/* ===== PAGE HERO (inner pages) ===== */
.page-hero{height:60vh;min-height:420px;position:relative;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden;}
.page-hero .inner{position:relative;z-index:1;}
.page-hero .tag{font-size:12px;letter-spacing:.35em;color:var(--amber);text-transform:uppercase;margin-bottom:18px;}
.page-hero h1{font-size:48px;font-weight:700;line-height:1.3;text-shadow:0 2px 16px rgba(40,24,8,.45);}
.page-hero p{color:var(--ivory);margin-top:16px;font-size:16px;text-shadow:0 1px 10px rgba(40,24,8,.5);}

/* ===== BUTTONS ===== */
.btn{display:inline-block;padding:14px 38px;border-radius:var(--radius);font-size:14px;letter-spacing:.1em;transition:.3s;cursor:pointer;}
.btn-primary{background:var(--gold);color:#fff;font-weight:500;}
.btn-primary:hover{background:var(--amber);color:#fff;}
.btn-outline{border:1px solid currentColor;}
.btn-dark{background:var(--green);color:var(--ivory);}
.btn-dark:hover{background:var(--green-soft);}
.btn+.btn{margin-left:14px;}

/* ===== SPLIT ===== */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
.split.reverse .img-block{order:2;}
.img-block{aspect-ratio:4/5;border-radius:4px;position:relative;overflow:hidden;background:var(--gold) center/cover no-repeat;}
.img-block.green{background-color:var(--green);}
.img-block.clay{background-color:var(--clay);}
.img-block .ph{display:none;}
.split h3{font-size:28px;margin-bottom:18px;color:var(--green);}
.split p{color:var(--muted);font-size:15px;margin-bottom:18px;}
.more{color:var(--gold);font-size:14px;letter-spacing:.08em;border-bottom:1px solid var(--gold);padding-bottom:4px;}

/* ===== CARDS / GRIDS ===== */
.grid{display:grid;gap:30px;}
.g2{grid-template-columns:repeat(2,1fr);}
.g3{grid-template-columns:repeat(3,1fr);}
.g4{grid-template-columns:repeat(4,1fr);}

.feature-card{text-align:center;padding:30px 20px;background:var(--paper);border-radius:6px;}
.feature-card .icon{width:54px;height:54px;border-radius:50%;border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;color:var(--gold);font-size:22px;}
.feature-card h4{font-size:16px;margin-bottom:10px;color:var(--green);}
.feature-card p{font-size:13px;color:var(--muted);}

/* 產品特色：圓形影像版 */
.feature-card.photo{background:var(--paper);padding:38px 22px 34px;transition:.4s;}
.feature-card.photo .circle{width:140px;height:140px;border-radius:50%;margin:0 auto 22px;
  background:var(--green) center/cover no-repeat;
  box-shadow:0 0 0 1px var(--gold), 0 0 0 7px var(--cream), 0 10px 26px rgba(13,28,15,.18);
  transition:.45s;}
.feature-card.photo:hover{transform:translateY(-4px);}
.feature-card.photo:hover .circle{transform:scale(1.05);}
.feature-card.photo h4{font-size:18px;color:var(--green);margin-bottom:10px;}
.feature-card.photo p{font-size:13px;color:var(--muted);}

.product-card{display:flex;flex-direction:column;background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 8px 30px rgba(0,0,0,.06);transition:.3s;}
.product-card:hover{transform:translateY(-6px);box-shadow:0 16px 40px rgba(0,0,0,.1);}
.product-img{height:240px;display:flex;align-items:flex-end;justify-content:flex-start;padding:18px;color:#fff;font-size:13px;letter-spacing:.15em;background:var(--brown) center/cover no-repeat;text-align:left;text-shadow:0 1px 6px rgba(0,0,0,.7);}
.product-body{padding:26px;flex:1;display:flex;flex-direction:column;}
.product-body .kind{font-size:11px;color:var(--gold);letter-spacing:.2em;text-transform:uppercase;}
.product-body h4{font-size:20px;margin:8px 0 10px;color:var(--green);}
.product-body p{font-size:13px;color:var(--muted);margin-bottom:16px;}
.price-row{margin-top:auto;display:flex;justify-content:space-between;align-items:center;}
.price{font-size:18px;color:var(--clay);font-weight:700;}
.mini-btn{font-size:12px;border:1px solid var(--green);padding:8px 18px;border-radius:var(--radius);letter-spacing:.05em;transition:.3s;}
.mini-btn:hover{background:var(--green);color:var(--ivory);}

/* ===== SECTIONS color variants ===== */
.bg-paper{background:var(--paper);}
.bg-green{background:var(--green);color:var(--ivory);}
.bg-green h2,.bg-green h3{color:var(--ivory);}
.bg-green .lead{color:#B9C2AE;}
.bg-dark{background:linear-gradient(135deg,var(--brown),#0D1C0F 55%,#3A2E14);color:#fff;}
.bg-dark h2{color:#fff;}
.bg-dark p{color:var(--ivory);}

.tag-row{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;}
.tag-pill{border:1px solid var(--amber);color:var(--amber);padding:8px 22px;border-radius:30px;font-size:13px;letter-spacing:.08em;}

/* ===== TIMELINE ===== */
.timeline{max-width:760px;margin:0 auto;position:relative;}
.timeline::before{content:'';position:absolute;left:140px;top:0;bottom:0;width:1px;background:var(--amber);}
.tl-item{display:grid;grid-template-columns:140px 1fr;gap:40px;margin-bottom:40px;position:relative;}
.tl-item .when{text-align:right;padding-right:24px;font-size:20px;line-height:1.5;white-space:nowrap;color:var(--clay);font-weight:700;font-family:'Noto Serif TC',serif;}
.tl-item .what{position:relative;}
.tl-item .what::before{content:'';position:absolute;left:-46px;top:8px;width:11px;height:11px;border-radius:50%;background:var(--gold);border:3px solid var(--cream);}
.tl-item h4{color:var(--green);margin-bottom:6px;}
.tl-item p{color:var(--muted);font-size:14px;}

/* ===== ACCORDION (FAQ) ===== */
.accordion{max-width:820px;margin:0 auto;}
.acc-item{border-bottom:1px solid #e3d8bf;}
.acc-q{padding:24px 0;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-size:17px;color:var(--green);font-family:'Noto Serif TC',serif;}
.acc-q .plus{color:var(--gold);font-size:22px;transition:.3s;}
.acc-item.open .acc-q .plus{transform:rotate(45deg);}
.acc-a{max-height:0;overflow:hidden;transition:max-height .4s ease;color:var(--muted);font-size:14px;}
.acc-a div{padding:0 0 24px;}
.faq-cat{font-size:13px;letter-spacing:.2em;color:var(--gold);text-transform:uppercase;margin:50px 0 10px;}

/* ===== TESTIMONIALS ===== */
.testi-card{background:var(--paper);padding:30px;border-radius:6px;}
.stars{color:var(--gold);margin-bottom:14px;letter-spacing:2px;}
.testi-card p{font-size:14px;color:#4a473c;margin-bottom:18px;}
.testi-name{font-size:13px;color:var(--green);font-weight:700;}

/* ===== QUALITY ===== */
.quality-row{display:grid;grid-template-columns:repeat(4,1fr);gap:36px 24px;text-align:center;max-width:880px;margin:0 auto;}
.quality-item{max-width:none;}
.quality-item .badge{width:88px;height:88px;border:1px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 18px;color:var(--gold);background:var(--cream);transition:.35s;}
.quality-item .badge svg{width:34px;height:34px;}
.quality-item:hover .badge{background:var(--gold);color:#fff;transform:translateY(-3px);}
.quality-item h4{font-size:16px;color:var(--green);margin-bottom:8px;letter-spacing:.04em;}
.quality-item p{font-size:13px;color:var(--muted);}

/* ===== ENJOY ===== */
.enjoy-card{background:#fff;border-radius:6px;padding:24px;text-align:center;border:1px solid #eadfc4;}
.enjoy-card .emoji{font-size:30px;margin-bottom:14px;}
.enjoy-card h4{font-size:15px;margin-bottom:8px;color:var(--green);}
.enjoy-card p{font-size:12px;color:var(--muted);}

/* ===== TEAM ===== */
.team-card{text-align:center;}
.team-card .photo{aspect-ratio:1;border-radius:50%;background:#caa55a center/cover no-repeat;margin-bottom:18px;overflow:hidden;font-size:0;}
.team-card h4{color:var(--green);font-size:18px;}
.team-card .role{color:var(--gold);font-size:12px;letter-spacing:.15em;margin:4px 0 12px;}
.team-card p{font-size:13px;color:var(--muted);}

/* ===== FORM ===== */
.form-wrap{max-width:680px;margin:0 auto;background:#fff;padding:50px;border-radius:8px;box-shadow:0 10px 40px rgba(0,0,0,.06);}
.field{margin-bottom:22px;}
.field label{display:block;font-size:13px;color:var(--green);margin-bottom:8px;letter-spacing:.05em;}
.field input,.field select,.field textarea{width:100%;padding:13px 16px;border:1px solid var(--hairline);border-radius:var(--radius);font-family:inherit;font-size:14px;background:var(--cream);transition:.3s;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold);background:#fff;}
.field textarea{resize:vertical;min-height:120px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:22px;}

/* ===== CONTACT CARDS ===== */
.contact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-bottom:60px;max-width:860px;margin-left:auto;margin-right:auto;}
.contact-card{background:#fff;border:1px solid #eadfc4;border-radius:8px;padding:34px 24px;text-align:center;transition:.3s;}
.contact-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,0,0,.08);}
.contact-card .ic{width:56px;height:56px;border-radius:50%;background:var(--paper);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:24px;}
.contact-card h4{color:var(--green);margin-bottom:8px;}
.contact-card p{font-size:13px;color:var(--muted);}

/* ===== KNOWLEDGE CARDS ===== */
.know-card{background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 8px 26px rgba(0,0,0,.05);transition:.3s;}
.know-card:hover{transform:translateY(-5px);box-shadow:0 16px 36px rgba(0,0,0,.09);}
.know-card .top{height:160px;background:var(--gold) center/cover no-repeat;display:flex;align-items:center;justify-content:center;font-size:40px;text-shadow:0 2px 8px rgba(0,0,0,.5);}
.know-card .body{padding:26px;}
.know-card h4{color:var(--green);font-size:19px;margin-bottom:10px;}
.know-card p{font-size:13px;color:var(--muted);margin-bottom:14px;}

/* ===== FLAVOR MAP ===== */
.flavor-map{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.flavor-zone{padding:30px 24px;border-radius:8px;color:#fff;}
.flavor-zone h4{font-size:20px;margin-bottom:10px;}
.flavor-zone .notes{font-size:13px;opacity:.92;margin-bottom:14px;}
.flavor-zone .bar{height:6px;background:rgba(255,255,255,.3);border-radius:3px;margin:6px 0;overflow:hidden;}
.flavor-zone .bar i{display:block;height:100%;background:#fff;}

/* ===== FOOTER ===== */
footer.site-footer{background:var(--green);color:rgba(231,219,199,.66);padding:60px 0 30px;font-size:13px;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px;}
.footer-grid h5{color:var(--ivory);font-size:14px;margin-bottom:16px;letter-spacing:.08em;}
.footer-grid a{display:block;color:rgba(231,219,199,.72);margin-bottom:8px;transition:.25s;}
.footer-grid a:hover{color:var(--gold);}
.footer-bottom{text-align:center;border-top:1px solid rgba(193,164,94,.28);padding-top:24px;color:rgba(231,219,199,.45);font-size:12px;}

/* ===== UTIL ===== */
.mt0{margin-top:0;}
.deco-quote{color:var(--gold);font-size:34px;font-family:'Playfair Display',serif;}

@media(max-width:880px){
  header.site-nav{padding:12px 20px;}
  .logo .word,.logo .mark{height:56px;}
  .nav-toggle{display:flex;}
  .site-nav{flex-wrap:wrap;}
  .site-nav nav{display:none;order:3;width:calc(100% + 40px);margin:16px -20px -20px;
    flex-direction:column;gap:0;padding:8px 20px 16px;background:var(--green);}
  body.menu-open .site-nav nav{display:flex;}
  .site-nav nav a{color:var(--ivory)!important;font-size:16px;padding:14px 4px;
    border-bottom:1px solid rgba(193,164,94,.2);}
  .site-nav nav a:last-child{border-bottom:0;}
  .site-nav nav a::after{display:none;}
  .site-nav nav a.active{color:var(--gold)!important;}
  .page-hero h1{font-size:34px;}
  .split,.split.reverse .img-block{grid-template-columns:1fr;order:0;}
  .g2,.g3,.g4,.contact-grid,.flavor-map{grid-template-columns:1fr;}
  .field-row{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .timeline::before{left:96px;}
  .tl-item{grid-template-columns:96px 1fr;gap:24px;}
  .tl-item .when{padding-right:14px;font-size:16px;}
  .tl-item .what::before{left:-29.5px;}
  .form-wrap{padding:30px 20px;}
}

/* ===== 可編輯圖片圖層（由 content/images.json 驅動，見 scripts/apply-images.mjs）===== */
.imgx{position:relative;isolation:isolate;overflow:hidden;}
.bgx{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:var(--img) var(--pos,50% 50%)/cover no-repeat;
  transform-origin:50% 50%;transition:scale 1.2s cubic-bezier(.22,.61,.36,1);}
/* 縮放：放大圖層本身並依焦點偏移，保證永遠蓋滿容器 */
.bgx.zm{inset:auto;left:var(--zl);top:var(--zt);width:var(--zw);height:var(--zw);}
/* 翻轉：固定以中心為軸 */
.bgx.fl{transform:scaleX(-1);}
.bgx.fx{filter:brightness(var(--br,1)) contrast(var(--ct,1)) saturate(var(--sa,1)) blur(var(--bl,0px));}
.bgx::after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(13,28,15,var(--ovt,0)),rgba(13,28,15,var(--ovb,0)));}
/* 內頁頁首：改用暖蜜棕遮罩（原本的墨綠在內頁大圖上顯得陰暗），濃度約為設定值的八成 */
.page-hero .bgx::after{background:linear-gradient(180deg,rgba(96,62,26,calc(var(--ovt,0) * .8)),rgba(66,40,16,calc(var(--ovb,0) * .8)));}

/* ===== 即將上架：灰色半透明遮罩（加上 class="coming-soon" 即可）===== */
.coming-soon{position:relative;}
.coming-soon::after{content:'即將上架';position:absolute;inset:0;z-index:5;
  display:flex;align-items:center;justify-content:center;
  background:rgba(15,15,15,.38);-webkit-backdrop-filter:grayscale(.3);backdrop-filter:grayscale(.3);
  color:#fff;font-size:17px;font-weight:600;letter-spacing:.35em;text-indent:.35em;
  text-shadow:0 1px 8px rgba(0,0,0,.35);border-radius:inherit;cursor:not-allowed;}
a.coming-soon,.coming-soon a{pointer-events:none;}
.coming-soon:hover{transform:none!important;}
.soon-tag{display:inline-block;font-size:12px;padding:8px 18px;border-radius:var(--radius);
  background:#9a9a9a;color:#fff;letter-spacing:.12em;cursor:not-allowed;}

/* 風味地圖：兩種蜜 */
.flavor-map.fm-2{grid-template-columns:repeat(2,1fr);max-width:720px;margin-left:auto;margin-right:auto;}
@media(max-width:880px){.flavor-map.fm-2{grid-template-columns:1fr;}}

/* ===== 商品卡共用（首頁精選、禮盒採購頁、蜂蜜產品頁） ===== */
.price.sizes{font-size:14px;font-weight:600;}
/* 去背商品照：完整顯示在米色底上，貼齊底部擺放（一致的地平線） */
.product-img.cutout{background:radial-gradient(ellipse at 50% 62%,#FBF8F1 0%,var(--paper) 72%);font-size:0;text-shadow:none;}
.product-img.cutout .bgx{inset:8% 8% 13%;background-size:contain;background-position:50% 100%;filter:drop-shadow(0 1px 2px rgba(13,28,15,.10));}
/* 接觸陰影：把商品輪廓上下翻轉、壓扁、塗黑、模糊，寬度自動貼合每件商品 */
.product-img.cutout .bgx::after{background:inherit;inset:0;transform-origin:50% 100%;transform:scale(.92,-.075);
  filter:brightness(0) blur(7px);opacity:.32;}
.gift-sets .product-img{height:200px;}
@media(max-width:1100px) and (min-width:881px){.g4.gift-sets{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.quality-row{grid-template-columns:1fr 1fr;gap:32px 16px;}}

/* 頁尾 CTA：照片底圖（每頁最後一區都用這個樣式） */
.cta-photo{padding:120px 0;}
.cta-photo h2,.cta-photo p{text-shadow:0 2px 16px rgba(13,28,15,.6);}
@media(max-width:880px){.cta-photo{padding:84px 0;}}

/* 品牌故事引言（關於我們） */
.story-quote{margin:20px 0 24px;padding:4px 0 4px 20px;border-left:3px solid var(--gold);font-family:'Noto Serif TC',serif;font-size:20px;line-height:1.7;color:var(--green);letter-spacing:.04em;}
@media(max-width:880px){.story-quote{font-size:18px;}}
