/* ===== Luxury Theme — 共通スタイル ===== */
/* INDEX.html と同じ「黒×シャンパンゴールド×明朝＋立体ボタン＋動く背景」を全ページで統一する */

:root {
  --lux-gold:#B8923F;
  --lux-gold-soft:#C9A45C;
  --lux-gold-light:#E6CF9A;
  --lux-ink:#0E0E10;
  --lux-graphite:#1F2024;
  --lux-cream:#FAF8F3;
  --lux-paper:#FFFFFF;
  --lux-line:#E8E2D3;
  --lux-text:#1A1A1A;
  --lux-sub:#6B6B6B;
}
.serif, .lux-serif {
  font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif !important;
}

/* ===== Body 背景：模様 + 金光 + 粒子 + 斜行リボン ===== */
html { position:relative !important; }
html::before {
  content:"";
  position:fixed; inset:0;
  z-index:-3;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg stroke='%23B8923F' fill='%23B8923F'%3E%3Cpath d='M32 28 v8 M28 32 h8' stroke-width='1.1' opacity='.16'/%3E%3Ccircle cx='32' cy='32' r='1.3' opacity='.18'/%3E%3Cpath d='M16 12 l4 4 M48 12 l-4 4 M16 52 l4 -4 M48 52 l-4 -4' stroke-width='.5' opacity='.08' fill='none'/%3E%3C/g%3E%3C/svg%3E");
  background-size:64px 64px;
  pointer-events:none;
  animation:lux-pattern-drift 90s linear infinite;
}
@keyframes lux-pattern-drift {
  0%   { background-position:0 0; }
  100% { background-position:64px 64px; }
}
html::after {
  content:"";
  position:fixed; inset:-20%;
  z-index:-3;
  background:
    radial-gradient(380px 280px at 30% 20%, rgba(230,207,154,.22) 0%, transparent 60%),
    radial-gradient(420px 320px at 75% 65%, rgba(184,146,63,.16) 0%, transparent 60%);
  pointer-events:none;
  animation:lux-spotlight 28s ease-in-out infinite alternate;
}
@keyframes lux-spotlight {
  0%   { background-position:0% 0%, 100% 100%; opacity:.85; }
  50%  { background-position:30% 20%, 60% 80%; opacity:1; }
  100% { background-position:10% 60%, 80% 30%; opacity:.9; }
}
body { position:relative !important; }
body::before {
  content:"";
  position:fixed; inset:-10%;
  z-index:-2;
  background:
    radial-gradient(960px 600px at 18% 22%, rgba(184,146,63,.32) 0%, transparent 60%),
    radial-gradient(820px 540px at 82% 74%, rgba(201,164,92,.26) 0%, transparent 62%),
    radial-gradient(680px 480px at 50% 55%, rgba(230,207,154,.20) 0%, transparent 65%),
    radial-gradient(780px 560px at 92% 12%, rgba(184,146,63,.22) 0%, transparent 60%);
  filter:blur(58px);
  animation:lux-aura 22s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes lux-aura {
  0%   { transform:translate3d(0,0,0) scale(1) rotate(0deg); opacity:.75; }
  33%  { transform:translate3d(-46px,28px,0) scale(1.10) rotate(.6deg); opacity:1; }
  66%  { transform:translate3d(34px,-22px,0) scale(.94) rotate(-.4deg); opacity:.92; }
  100% { transform:translate3d(22px,18px,0) scale(1.06) rotate(.3deg); opacity:.85; }
}
body::after {
  content:"";
  position:fixed; inset:-20% -20%;
  z-index:-1;
  background-image:
    radial-gradient(1.6px 1.6px at 12% 28%, rgba(184,146,63,.5) 0%, transparent 100%),
    radial-gradient(1px 1px at 60% 70%, rgba(201,164,92,.6) 0%, transparent 100%),
    radial-gradient(1.4px 1.4px at 80% 36%, rgba(230,207,154,.55) 0%, transparent 100%),
    radial-gradient(1.2px 1.2px at 32% 82%, rgba(184,146,63,.6) 0%, transparent 100%),
    radial-gradient(1.8px 1.8px at 88% 18%, rgba(201,164,92,.5) 0%, transparent 100%),
    radial-gradient(1px 1px at 24% 56%, rgba(230,207,154,.55) 0%, transparent 100%),
    radial-gradient(1.4px 1.4px at 68% 44%, rgba(184,146,63,.55) 0%, transparent 100%),
    radial-gradient(1.2px 1.2px at 8% 88%, rgba(201,164,92,.6) 0%, transparent 100%);
  background-size:480px 480px;
  background-repeat:repeat;
  opacity:.75;
  pointer-events:none;
  animation:lux-particles 50s linear infinite;
}
@keyframes lux-particles {
  0%   { transform:translate3d(0,0,0); }
  100% { transform:translate3d(-240px,-240px,0); }
}
@media (prefers-reduced-motion: reduce) {
  html::before, html::after, body::before, body::after { animation:none !important; }
}

/* 全ページ共通の body 下地カラー */
body {
  background:
    radial-gradient(800px 400px at 20% -10%, rgba(184,146,63,.06) 0%, transparent 60%),
    linear-gradient(180deg, #FBF8F1 0%, #F5F0E4 100%) !important;
  color:var(--lux-text) !important;
  font-family:-apple-system,"Hiragino Sans","Yu Gothic UI",sans-serif !important;
}

/* ===== Topnav 共通 ===== */
.lux-topnav {
  position:fixed; top:0; left:0; right:0; z-index:9000;
  background:linear-gradient(180deg, rgba(14,14,16,.96) 0%, rgba(21,22,26,.94) 100%);
  border-bottom:1px solid rgba(184,146,63,.45);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:0 6px 20px rgba(0,0,0,.25);
}
.lux-topnav-inner {
  max-width:1480px; margin:0 auto;
  padding:16px 32px;
  display:flex; align-items:center; gap:24px;
}
.lux-topnav-brand {
  font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif;
  font-size:16px; font-weight:600; color:var(--lux-gold-light);
  letter-spacing:.22em;
  padding-right:18px;
  border-right:1px solid rgba(184,146,63,.25);
  text-decoration:none;
}
.lux-topnav-brand:hover { color:#fff; }
.lux-topnav-actions { margin-left:auto; display:flex; gap:10px; align-items:center; }
.lux-topnav-btn {
  position:relative;
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 24px;
  color:#F0E5C8;
  background:linear-gradient(180deg, #2C2D35 0%, #1A1B20 55%, #0F1014 100%);
  border:1px solid var(--lux-gold);
  border-radius:2px;
  font-size:13px; font-weight:600;
  letter-spacing:.08em;
  text-decoration:none;
  font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif;
  white-space:nowrap;
  box-shadow:
    inset 0 1.5px 0 rgba(230,207,154,.3),
    inset 0 -2px 4px rgba(0,0,0,.6),
    0 4px 0 #050507,
    0 4px 0 1px rgba(184,146,63,.45),
    0 10px 22px rgba(0,0,0,.5);
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
  transform:translateY(0);
}
.lux-topnav-btn::before {
  content:"";
  position:absolute; left:3px; right:3px; top:3px; bottom:3px;
  border:1px solid rgba(184,146,63,.32);
  pointer-events:none;
}
.lux-topnav-btn:hover {
  background:linear-gradient(180deg, #F0DDA9 0%, #D4AE65 45%, #B8923F 100%);
  color:var(--lux-ink);
  border-color:#7A5E1F;
  transform:translateY(-2px);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.55),
    inset 0 -2px 4px rgba(0,0,0,.22),
    0 6px 0 #5C4516,
    0 6px 0 1px rgba(230,207,154,.6),
    0 14px 28px rgba(184,146,63,.5);
}
.lux-topnav-btn:hover::before { border-color:rgba(14,14,16,.32); }
.lux-topnav-btn:active {
  transform:translateY(2px);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.4),
    inset 0 -1px 2px rgba(0,0,0,.18),
    0 1px 0 #5C4516,
    0 1px 0 1px rgba(230,207,154,.4),
    0 4px 10px rgba(184,146,63,.32);
}
.lux-topnav-btn-ghost {
  background:linear-gradient(180deg, #232429 0%, #15161A 55%, #0B0C0F 100%);
  color:rgba(245,239,224,.8);
  border-color:rgba(184,146,63,.5);
}
.lux-topnav-btn-ghost:hover {
  background:linear-gradient(180deg, #3A3B43 0%, #25262C 55%, #15161A 100%);
  color:var(--lux-gold-light);
  border-color:var(--lux-gold-light);
}
.lux-topnav-ico { font-size:14px; }
@media (max-width: 1100px) {
  .lux-topnav-brand { display:none; }
  .lux-topnav-actions { gap:6px; }
  .lux-topnav-btn { padding:11px 16px; font-size:12px; }
}
@media (max-width: 768px) {
  .lux-topnav-inner { padding:10px 12px; gap:8px; flex-wrap:wrap; }
  .lux-topnav-actions { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; flex-wrap:nowrap; }
  .lux-topnav-btn { padding:9px 14px; font-size:11px; }
}

/* body は topnav 分の余白を確保 */
body.lux-page { padding-top:74px; }
@media (max-width: 768px) { body.lux-page { padding-top:130px; } }

/* 既存ページの旧チープなtopnav群を全部非表示（lux-topnavに置き換え済み） */
body.lux-page .top-nav,
body.lux-page > .puffy-btn,
body.lux-page > [style*="position:fixed; top:14px; right:14px"] {
  display:none !important;
}
/* 既存ページが puffy-btn を内部で使っていたら、せめて立体感を継承 */
body.lux-page .puffy-btn {
  font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif !important;
  letter-spacing:.08em !important;
}

/* ===== Container ===== */
.lux-container {
  max-width:1200px;
  margin:0 auto;
  padding:24px 32px 80px;
  position:relative;
}
@media (max-width: 768px) { .lux-container { padding:16px 16px 60px; } }

/* ===== Headings ===== */
.lux-page-title {
  font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif;
  font-size:32px; font-weight:600; color:var(--lux-ink);
  letter-spacing:.08em;
  margin:24px 0 8px;
}
.lux-page-eyebrow {
  display:inline-block;
  padding:5px 14px;
  border:1px solid var(--lux-gold);
  font-size:10px; font-weight:600;
  letter-spacing:.28em; text-transform:uppercase;
  color:var(--lux-gold);
  background:rgba(255,255,255,.6);
  margin-bottom:14px;
}
.lux-page-rule {
  width:64px; height:1px; background:var(--lux-gold);
  margin:16px 0 24px;
}
.lux-page-sub {
  font-size:14px; line-height:1.85; color:var(--lux-sub);
  max-width:720px;
  letter-spacing:.04em;
  margin:0 0 32px;
}

/* セクション */
.lux-section {
  position:relative;
  background:rgba(255,255,255,.72);
  border:1px solid var(--lux-line);
  padding:28px 32px;
  margin-bottom:24px;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 6px 24px rgba(14,14,16,.05);
}
.lux-section::before {
  content:"";
  position:absolute; left:6px; right:6px; top:6px; bottom:6px;
  border:1px solid rgba(184,146,63,.18);
  pointer-events:none;
}
.lux-section-title {
  font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif;
  font-size:20px; font-weight:600; color:var(--lux-ink);
  letter-spacing:.06em;
  margin:0 0 18px;
  padding-bottom:12px;
  border-bottom:1px solid var(--lux-line);
  position:relative; z-index:1;
}
.lux-section > * { position:relative; z-index:1; }

/* 立体ボタン（ページ内CTA用） */
.lux-btn {
  position:relative;
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 24px;
  color:#F0E5C8;
  background:linear-gradient(180deg, #2C2D35 0%, #1A1B20 55%, #0F1014 100%);
  border:1px solid var(--lux-gold);
  border-radius:2px;
  font-size:13px; font-weight:600;
  letter-spacing:.12em;
  text-decoration:none;
  font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif;
  cursor:pointer;
  white-space:nowrap;
  box-shadow:
    inset 0 1.5px 0 rgba(230,207,154,.3),
    inset 0 -2px 4px rgba(0,0,0,.6),
    0 4px 0 #050507,
    0 4px 0 1px rgba(184,146,63,.45),
    0 10px 22px rgba(0,0,0,.45);
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
  transform:translateY(0);
}
.lux-btn::before {
  content:"";
  position:absolute; left:3px; right:3px; top:3px; bottom:3px;
  border:1px solid rgba(184,146,63,.32);
  pointer-events:none;
}
.lux-btn:hover {
  background:linear-gradient(180deg, #F0DDA9 0%, #D4AE65 45%, #B8923F 100%);
  color:var(--lux-ink);
  border-color:#7A5E1F;
  transform:translateY(-2px);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.55),
    inset 0 -2px 4px rgba(0,0,0,.22),
    0 6px 0 #5C4516,
    0 6px 0 1px rgba(230,207,154,.6),
    0 14px 28px rgba(184,146,63,.5);
}
.lux-btn:active {
  transform:translateY(2px);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.4),
    inset 0 -1px 2px rgba(0,0,0,.18),
    0 1px 0 #5C4516,
    0 1px 0 1px rgba(230,207,154,.4),
    0 4px 10px rgba(184,146,63,.32);
}
.lux-btn-light {
  background:linear-gradient(180deg, #FFFFFF 0%, #F5F0E4 100%);
  color:var(--lux-ink);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.9),
    inset 0 -2px 4px rgba(184,146,63,.18),
    0 4px 0 rgba(184,146,63,.3),
    0 8px 18px rgba(0,0,0,.12);
}
.lux-btn-light:hover {
  background:linear-gradient(180deg, #F0DDA9 0%, #D4AE65 45%, #B8923F 100%);
  color:var(--lux-ink);
}

/* リンク */
a.lux-link {
  color:var(--lux-gold);
  text-decoration:none;
  border-bottom:1px solid var(--lux-gold-light);
  transition:color .15s ease, border-color .15s ease;
}
a.lux-link:hover { color:var(--lux-ink); border-color:var(--lux-ink); }

/* テキスト */
.lux-text { color:var(--lux-text); font-size:14px; line-height:1.85; }
.lux-text strong { color:var(--lux-ink); font-weight:700; }
.lux-text code {
  background:rgba(184,146,63,.08);
  border:1px solid rgba(184,146,63,.25);
  padding:1px 8px;
  font-family:"SF Mono","Menlo","Consolas",monospace;
  font-size:12px;
}
.lux-text pre {
  background:var(--lux-ink);
  color:var(--lux-gold-light);
  padding:18px 22px;
  overflow-x:auto;
  border:1px solid var(--lux-gold);
  font-family:"SF Mono","Menlo","Consolas",monospace;
  font-size:12px;
  line-height:1.6;
  margin:14px 0;
  position:relative;
}
.lux-text pre::before {
  content:""; position:absolute; left:4px; right:4px; top:4px; bottom:4px;
  border:1px solid rgba(184,146,63,.3);
  pointer-events:none;
}
.lux-text pre code {
  background:transparent; border:none; padding:0; color:inherit; font-size:inherit;
}