/*
Theme Name: Gold LP
Theme URI: https://example.com
Author: Your Name
Description: 金の買取・販売に特化した、ランディングページ専用のシンプルなWordPressテーマ。ブログ機能は一切持たず、1枚のLPを表示することだけに特化しています。電話番号・価格・会社情報は管理画面のカスタマイザーから編集できます。
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: gold-lp
*/

/* ============================================================
   デザイントークン

   色: 深いインク紺(信頼)・和紙のような紙色(温かみ)・
       燻んだ真鍮金(華美すぎない金属感)・朱色に近い深紅(唯一のCTA色)
   書体: 見出しに明朝体(老舗の質感)、本文にゴシック体
   余白: セクション間を大きく取り、要素を詰め込みすぎない
============================================================ */
:root{
  --paper: #F7F4EC;
  --ink: #1C2226;
  --ink-soft: #5B6169;
  --navy: #16222C;
  --navy-line: rgba(255,255,255,0.14);
  --brass: #8C6A2F;
  --brass-line: #D8CBA8;
  --seal: #9B3A2E;
  --seal-dark: #7E2E24;
  --hairline: #E3DCC8;
  --space-xl: 128px;
  --space-lg: 88px;
  --space-md: 56px;
  --space-sm: 28px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family: "Noto Sans JP", "Hiragino Sans", system-ui, sans-serif;
  color: var(--ink);
  background: var(--paper);
  line-height: 1.9;
  font-size: 18px;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ text-decoration:none; color:inherit; }
:focus-visible{ outline: 2px solid var(--brass); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

h1, h2, h3{
  font-family: "Shippori Mincho", "Hiragino Mincho ProN", serif;
  font-weight: 600;
  letter-spacing: 0.02em;
}

section{ padding: var(--space-lg) 24px; }
.lp-inner{ max-width: 900px; margin:0 auto; }

h2.lp-h2{
  font-size: 30px;
  margin: 0 0 14px;
  text-align:left;
}
.lp-h2-sub{
  color: var(--ink-soft);
  font-size:16px;
  margin: 0 0 var(--space-md);
  max-width: 60ch;
}
@media (max-width: 640px){
  :root{ --space-lg: 56px; --space-md: 36px; }
  section{ padding: var(--space-lg) 20px; }
  h2.lp-h2{ font-size:24px; }
}

/* ---------- 電話番号バー ---------- */
.lp-topbar{
  background: var(--navy);
  color: rgba(255,255,255,0.82);
  text-align:center;
  font-size:14px;
  padding: 10px 16px;
  letter-spacing:0.02em;
}
.lp-topbar strong{ color:#fff; font-weight:600; }

/* ---------- ヒーロー ---------- */
.lp-hero{
  position:relative;
  background: var(--navy);
  color:#fff;
  padding: var(--space-xl) 24px var(--space-lg);
  overflow:hidden;
}
.lp-hero-bg{ position:absolute; inset:0; z-index:0; }
.lp-hero-slide{
  position:absolute; inset:0;
  background-size:cover;
  background-position:center;
  opacity:0;
  transition: opacity 1.4s ease;
}
.lp-hero-slide.is-active{ opacity:1; }
.lp-hero-overlay{
  position:absolute; inset:0;
  background: var(--navy);
  opacity: var(--hero-overlay, 0.55);
}
@media (prefers-reduced-motion: reduce){
  .lp-hero-slide{ transition:none; }
}
.lp-hero-content{ position:relative; z-index:1; max-width: 720px; margin:0 auto; }
.lp-hero-badge{
  display:inline-block;
  font-size:14px;
  color: #D8CBA8;
  border-bottom: 1px solid var(--navy-line);
  padding-bottom: 14px;
  margin-bottom: 32px;
}
.lp-hero h1{
  font-size: 44px;
  line-height:1.7;
  margin: 0 0 24px;
  font-weight:600;
}
.lp-hero h1 span{ color: #E4D6AE; }
.lp-hero p{
  font-family: "Noto Sans JP", sans-serif;
  font-size:17px;
  color: rgba(255,255,255,0.72);
  max-width: 46em;
  margin: 0 0 var(--space-md);
  line-height:2;
}
@media (max-width: 640px){
  .lp-hero{ padding-top: 72px; }
  .lp-hero h1{ font-size:28px; }
}

.lp-cta-group{ display:flex; gap:16px; flex-wrap:wrap; }
.lp-btn{
  display:inline-block;
  padding: 18px 36px;
  border: 1px solid transparent;
  font-weight:600;
  font-size:16px;
  border-radius: 3px;
}
.lp-btn.is-primary{ background: var(--seal); color:#fff; }
.lp-btn.is-primary:hover{ background: var(--seal-dark); }
.lp-btn.is-secondary{ background:transparent; color:#fff; border-color: rgba(255,255,255,0.4); }
.lp-btn.is-secondary:hover{ border-color:#fff; }
.lp-btn small{ display:block; font-size:12px; font-weight:400; opacity:0.75; margin-top:4px; }

/* ---------- 線画アイコン共通 ---------- */
.lp-icon{ color: var(--brass); flex-shrink:0; }

/* ---------- 実写プレースホルダー ---------- */
.lp-photo-placeholder{
  border: 1px dashed var(--brass-line);
  aspect-ratio: 4 / 5;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  color: var(--ink-soft);
  text-align:center;
  padding: 20px;
}
.lp-photo-placeholder .lp-icon{ width:32px; height:32px; color: var(--brass-line); }
.lp-photo-placeholder p{ font-size:14px; margin:0; max-width:20em; line-height:1.8; }

/* ---------- 選ばれる理由(2カラム) ---------- */
.lp-why-grid{
  display:grid;
  grid-template-columns: 1.3fr 0.7fr;
  gap: 56px;
  align-items:start;
  max-width: 1100px !important;
}
@media (max-width: 860px){
  .lp-why-grid{ grid-template-columns: 1fr; gap:32px; }
  .lp-why-grid .lp-photo-placeholder{ aspect-ratio: 16/9; }
}

/* ---------- 信頼バッジ(アイコン付き) ---------- */
.lp-badge-list li{ display:flex; align-items:center; gap:10px; }
.lp-badge-list .lp-icon{ width:18px; height:18px; }
.lp-badges{ padding: var(--space-md) 24px; border-bottom: 1px solid var(--hairline); }
.lp-badge-list{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap: 0;
  list-style:none;
  margin:0; padding:0;
}
.lp-badge-list li{
  font-size: 15px;
  color: var(--ink-soft);
  padding: 0 28px;
  border-left: 1px solid var(--hairline);
}
.lp-badge-list li:first-child{ border-left:none; }
@media (max-width: 640px){
  .lp-badge-list{ flex-direction:column; align-items:center; gap:12px; }
  .lp-badge-list li{ border-left:none; padding:0; }
}

/* ---------- 本日の買取価格 ---------- */
.lp-price-table{ border-top: 1px solid var(--ink); }
.lp-price-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  padding: 22px 0;
  border-bottom: 1px solid var(--hairline);
}
.lp-price-name{ font-size:16px; font-weight:600; }
.lp-price-name span{
  display:block; font-size:13px; font-weight:400; color: var(--ink-soft); margin-top:4px;
}
.lp-price-value{ font-family:"Shippori Mincho", serif; font-size:30px; font-weight:600; color: var(--seal); }
.lp-price-value small{ font-family:"Noto Sans JP",sans-serif; font-size:13px; font-weight:500; color: var(--ink-soft); margin-left:4px; }
.lp-price-note{ font-size:13px; color: var(--ink-soft); margin-top: 20px; }

/* ---------- 価格の推移グラフ ---------- */
.lp-trend{ background:#fff; border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); }
.lp-trend-card{ border-top: 1px solid var(--ink); padding-top: var(--space-sm); }
.lp-trend-card-daily{ margin-top: var(--space-md); padding-top: 24px; border-top: 1px solid var(--hairline); }
.lp-trend-empty{
  font-size:13px;
  color: var(--ink-soft);
  padding: 24px 0 4px;
  line-height:1.9;
}
.lp-trend-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:20px;
  margin-bottom: 28px;
}
.lp-trend-label{ display:block; font-size:12px; color: var(--ink-soft); margin-bottom:6px; }
.lp-trend-value{ font-family:"Shippori Mincho", serif; font-size:28px; font-weight:600; color: var(--seal); }
.lp-trend-legend{ display:flex; gap:16px; flex-wrap:wrap; font-size:13px; color: var(--ink-soft); }
.lp-trend-legend span{ cursor:pointer; user-select:none; padding:4px 8px; margin:-4px -8px; transition:background .15s, opacity .15s; }
.lp-trend-legend span:hover{ background:rgba(28,34,38,0.05); }
.lp-trend-legend span.is-active{ background:var(--ink); color:#fff; }
.lp-trend-legend span.is-dim{ opacity:0.4; }
.lp-trend-legend i{ display:inline-block; width:14px; height:2px; margin-right:6px; vertical-align:middle; }
.lp-trend-legend i.is-k24{ background: #9B3A2E; }
.lp-trend-legend i.is-k18{ background: #8C6A2F; }
.lp-trend-legend i.is-k10{ background: #4F6D64; }
.lp-trend-legend i.is-pt900{ background: #8A93A0; }
.lp-trend-legend i.is-sell{ background:none; border-bottom:2px dashed #5B6169; height:0; }
.lp-trend-chart-wrap{ position:relative; height:260px; }
.lp-trend-chart-wrap canvas{ cursor:crosshair; }
.lp-trend-tooltip{
  position:absolute; pointer-events:none; opacity:0; transition:opacity .12s ease;
  background: var(--navy); color:#fff; font-size:12px; padding:10px 14px;
  transform:translate(-50%,-108%); white-space:nowrap; line-height:1.8; z-index:5;
}
.lp-trend-tooltip.is-visible{ opacity:1; }
.lp-trend-tooltip .t-row{ display:flex; align-items:center; gap:6px; }
.lp-trend-tooltip .t-row.is-muted{ opacity:0.4; }
.lp-trend-tooltip b{ display:inline-block; width:8px; height:8px; border-radius:50%; }
.lp-trend-note{
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--hairline);
  font-size:12px;
  color: var(--ink-soft);
  line-height:1.9;
}
@media (max-width: 640px){
  .lp-trend-chart-wrap{ height:220px; }
}

/* ---------- ご利用の流れ ---------- */
.lp-steps{
  list-style:none;
  margin: var(--space-sm) 0 0;
  padding:0;
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.lp-step{ padding-top: 20px; border-top: 1px solid var(--ink); }
.lp-step-num{
  display:block;
  font-family:"Shippori Mincho", serif;
  font-size: 34px;
  color: var(--brass);
  margin-bottom: 14px;
}
.lp-step h3{ font-size:16px; margin: 0 0 10px; font-weight:600; }
.lp-step p{ font-family:"Noto Sans JP",sans-serif; font-size:14px; color: var(--ink-soft); margin:0; }
@media (max-width: 760px){
  .lp-steps{ grid-template-columns: 1fr 1fr; }
}

/* ---------- 選ばれる理由 ---------- */
.lp-reasons{ margin-top: var(--space-sm); }
.lp-reason{
  padding: 32px 0;
  border-top: 1px solid var(--hairline);
  display:grid;
  grid-template-columns: 240px 1fr;
  gap: 32px;
}
.lp-reason:last-child{ border-bottom: 1px solid var(--hairline); }
.lp-reason h3{ font-size:19px; margin:0; font-weight:600; }
.lp-reason p{ font-family:"Noto Sans JP",sans-serif; font-size:15px; color: var(--ink-soft); margin:0; max-width:56ch; }
@media (max-width: 700px){
  .lp-reason{ grid-template-columns: 1fr; gap:10px; }
}

/* ---------- お客様の声 ---------- */
.lp-voice-list{ margin-top: var(--space-sm); }
.lp-voice{
  padding: 28px 0;
  border-top: 1px solid var(--hairline);
}
.lp-voice:last-child{ border-bottom: 1px solid var(--hairline); }
.lp-voice-stars{ color: var(--brass); font-size:14px; margin-bottom:10px; letter-spacing:2px; }
.lp-voice p{ font-family:"Noto Sans JP",sans-serif; font-size:16px; color: var(--ink); margin: 0 0 10px; max-width:60ch; line-height:2; }
.lp-voice-name{ font-size:13px; color: var(--ink-soft); }

/* ---------- FAQ ---------- */
.lp-faq{ margin-top: var(--space-sm); }
.lp-faq-item{
  border-top: 1px solid var(--hairline);
}
.lp-faq-item:last-child{ border-bottom: 1px solid var(--hairline); }
.lp-faq-item summary{
  cursor:pointer;
  list-style:none;
  padding: 22px 32px 22px 0;
  font-weight:600;
  font-size:16px;
  position:relative;
}
.lp-faq-item summary::-webkit-details-marker{ display:none; }
.lp-faq-item summary::after{
  content:"+";
  position:absolute; right:4px; top:50%; transform:translateY(-50%);
  font-size:22px; color: var(--brass); font-weight:300;
}
.lp-faq-item[open] summary::after{ content:"−"; }
.lp-faq-answer{
  font-family:"Noto Sans JP",sans-serif;
  padding: 0 32px 26px 0;
  font-size:15px;
  color: var(--ink-soft);
  max-width: 62ch;
}

/* ---------- 会社情報・古物商許可 ---------- */
.lp-company{ background: var(--navy); color: rgba(255,255,255,0.9); }
.lp-company h2.lp-h2{ color:#fff; }
.lp-company-table{ width:100%; border-collapse:collapse; font-size:15px; margin-top: var(--space-sm); }
.lp-company-table th, .lp-company-table td{
  padding: 14px 0;
  border-bottom: 1px solid var(--navy-line);
  text-align:left;
}
.lp-company-table th{
  width: 160px;
  color: #C7B98B;
  font-weight:500;
  white-space:nowrap;
}
.lp-license-note{
  margin-top: 24px;
  font-size:13px;
  color: rgba(255,255,255,0.55);
  line-height:2;
  max-width: 70ch;
}

/* ---------- 最終CTA ---------- */
.lp-final{ text-align:left; border-top: 1px solid var(--hairline); }
.lp-final .lp-inner{ max-width: 640px; }

/* ---------- 追従CTA(モバイル固定) ---------- */
.lp-sticky-cta{
  position:fixed; left:0; right:0; bottom:0;
  display:none; z-index: 999;
}
.lp-sticky-cta a{
  flex:1; text-align:center; padding: 15px 0;
  font-weight:600; font-size:14.5px;
}
.lp-sticky-cta .is-call{ background: var(--navy); color:#fff; }
.lp-sticky-cta .is-line{ background: var(--seal); color:#fff; }
@media (max-width: 760px){
  .lp-sticky-cta{ display:flex; }
  body{ padding-bottom: 52px; }
}

/* ---------- シンプルページ(会社概要・特商法表記など) ---------- */
.lp-simple-header{
  background: var(--navy);
  color: rgba(255,255,255,0.85);
  padding: 22px;
  font-size:14px;
}
.lp-simple-header a{ color:#D8CBA8; }
.lp-simple-content{ max-width: 720px; margin: 0 auto; padding: var(--space-lg) 24px; }
.lp-simple-content h1{ font-size:27px; margin-bottom: var(--space-sm); }
.lp-simple-content table{ width:100%; border-collapse:collapse; margin: 1.6em 0; font-size:15px; }
.lp-simple-content table th, .lp-simple-content table td{
  border-bottom:1px solid var(--hairline);
  padding:12px 0;
  text-align:left;
  vertical-align:top;
}
.lp-simple-content table th{ width:180px; color: var(--ink-soft); font-weight:500; }
