/* ══════════════════════════════════════════════════════════
   斌先生工作室 · Studio ── 共用設計系統
   來源：drinkcam_buy_設計規範（米色暖橘 × 文青職人）

   ⚠️ 金流頁（/drinkcam/buy、/guestars/buy）刻意「內嵌」樣式、
      不引用這個檔案 —— 付款頁不依賴任何外部資源，最穩。
      這裡供非金流頁面（需求表、後台）共用。
   ══════════════════════════════════════════════════════════ */

:root {
  --bg: #F7F3ED;
  --surface: #FDFBF7;
  --text-primary: #2C1F17;
  --text-secondary: #6D5B4E;
  --text-muted: #9B8A7C;
  --accent: #C25E3F;
  --accent-hover: #A94A2E;
  --accent-soft: #F5D9CE;
  --border: #E5DDD1;
  --border-strong: #C9BEAE;
  --success: #6B8B4D;

  --gs-navy: #1C1725; --gs-coral: #C4819A; --gs-gold: #C9A87C; --gs-cream: #F5F0EB;

  --shadow-soft: 0 2px 12px rgba(44,31,23,.06);
  --shadow-med:  0 4px 24px rgba(44,31,23,.08);
  --shadow-strong: 0 8px 32px rgba(44,31,23,.12);

  --font-serif: "Noto Serif TC","Playfair Display","EB Garamond",Georgia,serif;
  --font-sans:  "Noto Sans TC","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-mono:  "JetBrains Mono","Fira Code",ui-monospace,monospace;

  --radius-sm: 8px; --radius: 16px; --radius-lg: 24px;
}

*{box-sizing:border-box;margin:0;padding:0}

body {
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--text-primary);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

h1,h2,h3,h4,h5 {
  font-family: var(--font-serif); font-weight: 500; line-height: 1.25;
  color: var(--text-primary); letter-spacing: -0.01em;
}
a { color: var(--accent); }

.eyebrow { display:inline-block; font-size:.8rem; font-weight:500; letter-spacing:.15em;
  text-transform:uppercase; color:var(--accent); }

/* ── Header ── */
.site-header { background:rgba(247,243,237,.85); backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--border); position:sticky; top:0; z-index:100; }
.site-header nav { display:flex; justify-content:space-between; align-items:center;
  padding:18px 24px; max-width:1200px; margin:0 auto; }
.brand { text-decoration:none; color:var(--text-primary); display:inline-flex; align-items:baseline; gap:6px; }
.brand-name { font-family:var(--font-serif); font-size:1.15rem; font-weight:600; letter-spacing:.02em; }
.brand-sub { font-family:var(--font-serif); font-style:italic; font-size:.85rem; color:var(--text-secondary); }
.nav-links { display:flex; gap:32px; align-items:center; }
.nav-links a { color:var(--text-primary); text-decoration:none; font-size:.95rem; transition:color .2s; }
.nav-links a:hover { color:var(--accent); }

/* ── 按鈕 ── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:14px 28px; border-radius:var(--radius-sm); text-decoration:none; font-weight:500;
  transition:all .2s; font-size:.95rem; cursor:pointer; border:1px solid transparent;
  font-family:var(--font-sans); white-space:nowrap; }
.btn-primary { background:var(--accent); color:var(--surface); }
.btn-primary:hover { background:var(--accent-hover); transform:translateY(-1px); }
.btn-ghost { background:transparent; color:var(--text-primary); border-color:var(--border-strong); }
.btn-ghost:hover { border-color:var(--accent); color:var(--accent); }
.btn-lg { padding:16px 32px; font-size:1rem; }
.btn:disabled { opacity:.55; cursor:not-allowed; transform:none; }

/* ── 卡片 ── */
.card { background:var(--surface); padding:40px 32px; border-radius:var(--radius);
  border:1px solid var(--border); box-shadow:var(--shadow-soft);
  transition:transform .25s, box-shadow .25s; }
.card:hover { transform:translateY(-3px); box-shadow:var(--shadow-med); }
.price { font-family:var(--font-serif); font-size:1.2rem; color:var(--text-primary); }

/* ── 表單 ── */
.form-row { margin-bottom:24px; }
.form-row label { display:block; margin-bottom:8px; font-size:.9rem;
  color:var(--text-secondary); font-weight:500; }
.form-row label em { font-style:normal; color:var(--accent); }
.form-row label .hint { color:var(--text-muted); font-weight:400; }
.form-row input, .form-row select, .form-row textarea {
  width:100%; padding:12px 16px; border:1px solid var(--border-strong);
  border-radius:var(--radius-sm); background:var(--surface); font-family:var(--font-sans);
  font-size:1rem; color:var(--text-primary); transition:border-color .2s, box-shadow .2s; }
.form-row input:focus, .form-row select:focus, .form-row textarea:focus {
  outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.form-row textarea { min-height:84px; resize:vertical; }

/* ── Footer ── */
.site-footer { background:var(--surface); border-top:1px solid var(--border);
  padding:72px 24px 32px; margin-top:96px; }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr; gap:48px;
  max-width:1200px; margin:0 auto 48px; }
.footer-grid .brand-name { display:block; margin-bottom:6px; }
.tagline { color:var(--text-secondary); font-size:.9rem; }
.footer-heading { font-family:var(--font-serif); font-weight:500; font-size:1rem; margin-bottom:18px; }
.site-footer a { color:var(--text-secondary); text-decoration:none; display:block;
  margin-bottom:10px; font-size:.9rem; }
.site-footer a:hover { color:var(--accent); }
.contact-info { color:var(--text-secondary); font-size:.85rem; margin-top:16px; line-height:1.8; font-style:normal; }
.footer-bottom { text-align:center; color:var(--text-muted); font-size:.85rem; max-width:1200px; margin:0 auto; }

@media (max-width:640px){
  .footer-grid{ grid-template-columns:1fr; gap:32px; }
  .nav-links{ gap:18px; }
  .nav-links a{ font-size:.85rem; }
}