/*
Theme Name: Coms Auto Craft
Theme URI: https://www.comsautocraft.com/
Author: Coms Auto Craft
Description: 株式会社コムズオートクラフト専用テーマ。ヴィンテージカー復元・販売サイト向け。販売車両はカスタム投稿タイプで管理します。
Version: 2.8.1
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: coms-auto-craft
*/

/* ============================================================
   カラー・フォント定義
   ここを書き換えるとサイト全体の色が変わります
   ============================================================ */
:root{
  --ink:#1a1b1d;        /* 黒鉛。背景・文字 */
  --paper:#f0f0ee;      /* 明るい灰。明部の背景 */
  --steel:#26282b;      /* 鋼の暗部 */
  /* ── 金色は背景ごとに2つ持ちます ──────────────────
     暗い面にはそのままの金、明るい面には濃い金を使います。
     1色で兼ねると、どちらかで必ず読みにくくなるためです。
     （コントラスト比：暗い面 6.99 / 明るい面 4.93。いずれも基準を満たします） */
  --brass:#c2a068;         /* 暗い面のアクセント（曇りのある真鍮） */
  --brass-bright:#d6b57e;  /* 暗い面で少し強調したいとき */
  --brass-deep:#7a6533;    /* 明るい面のアクセント（古い真鍮） */

  --line:rgba(194,160,104,.24);
  --muted:#9a9da1;

  /* 明るい面で使う色 */
  --paper-line:#d8d4c8;
  --paper-soft:#e6e5e0;
  --paper-text:#43464a;
  --paper-muted:#5f6266;

  --display:"Cormorant Garamond","Times New Roman",serif;
  --body:"Zen Kaku Gothic New",system-ui,sans-serif;
  --util:"Barlow Condensed",sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:78px}
body{
  font-family:var(--body);
  background:var(--ink);
  color:var(--paper);
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}

/* ============================================================
   日本語の折り返し制御
   「学」だけが次の行に落ちるような、不自然な改行を防ぎます
   ============================================================ */
h1,h2,h3,h4{
  line-break:strict;              /* 句読点や小書き文字を行頭に置かない */
  word-break:auto-phrase;         /* 文節の切れ目で折り返す（対応ブラウザ） */
  overflow-wrap:break-word;
}
p,li,dd,dt,td,th{
  line-break:strict;
  text-wrap:pretty;               /* 最終行に単語1つだけ残るのを防ぐ */
  overflow-wrap:break-word;
}
/* 見出しの各行。設定画面で入れた改行がそのまま反映されます */
.ln{display:inline-block}

.wrap{max-width:1200px;margin:0 auto;padding:0 28px}

.eyebrow{
  font-family:var(--util);
  text-transform:uppercase;
  letter-spacing:.32em;
  font-size:.78rem;
  color:var(--brass-bright);
  font-weight:500;
}

/* ============================================================
   ヘッダー
   ============================================================ */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(26,27,29,.76);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:78px;gap:20px}
.brand{
  display:inline-flex;align-items:center;gap:14px;
  font-family:var(--display);font-size:1.5rem;letter-spacing:.12em;
  color:var(--paper);line-height:1.2;
}
.brand-text{display:block}
.brand-name{display:block;white-space:nowrap}
.brand small{
  display:block;font-family:var(--util);font-size:.6rem;
  letter-spacing:.4em;color:var(--brass);text-transform:uppercase;
  margin-top:2px;white-space:nowrap;
}
/* ── ロゴ ──
   深緑の楕円が暗い背景に沈まないよう、ごく薄い影で浮かせています。
   ロゴそのものの色は一切変えていません。 */
.brand img,.site-logo{
  max-height:54px;width:auto;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.55));
  transition:.3s;
}
.brand:hover img,.brand:hover .site-logo{filter:drop-shadow(0 2px 14px rgba(194,160,104,.35))}
.custom-logo-link{display:inline-block;line-height:0}

.foot-brand{display:inline-flex;align-items:center;gap:16px;line-height:1.2}
.foot-brand .brand-text{line-height:1.2}
.foot-logo{max-height:82px;width:auto;filter:drop-shadow(0 2px 12px rgba(0,0,0,.5))}

.menu{display:flex;gap:30px;list-style:none;font-family:var(--util);text-transform:uppercase;letter-spacing:.14em;font-size:.95rem}
.menu a{color:var(--paper);opacity:.82;transition:.25s;padding-bottom:4px;border-bottom:1px solid transparent;display:inline-block}
.menu a:hover{opacity:1;border-bottom-color:var(--brass)}

.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:0;padding:8px;z-index:120}
.burger span{width:26px;height:2px;background:var(--paper);transition:.3s;display:block}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ============================================================
   ヒーロー（動画）
   ============================================================ */
.hero{position:relative;height:100vh;min-height:600px;overflow:hidden;display:flex;align-items:center}
.hero-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-fallback{background:linear-gradient(150deg,#232528,#1a1b1d 55%,#101113)}

/* 静止画の背景。ゆっくり拡大して、1枚でも動きが出ます */
.hero-still{
  background-size:cover;background-position:center;
  animation:kenburns 26s ease-in-out infinite alternate;
}
@keyframes kenburns{
  from{transform:scale(1.02)}
  to{transform:scale(1.14)}
}
/* 動画が再生されているときは静止画を隠す */
.hero.playing .hero-still{opacity:0;transition:opacity .8s ease}
/* 動画の読み込み中は静止画を上に出しておく */
.hero video.hero-media{z-index:0}
.hero .hero-still{z-index:1}
.hero::after{z-index:2!important}
.hero-inner{z-index:3!important}
.scroll-hint{z-index:3!important}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,17,19,.90),rgba(16,17,19,.32));z-index:1}
.hero-inner{position:relative;z-index:2}
.hero h1{
  font-family:var(--display);font-weight:500;
  font-size:clamp(2.2rem,5.2vw,4.6rem);
  line-height:1.18;letter-spacing:.02em;
  margin:18px 0 26px;
  max-width:22ch;
}
.hero-lead{max-width:44ch;color:#cfd1d3;font-size:1.02rem;line-height:1.9}
.hero-actions{display:flex;align-items:stretch;gap:16px;flex-wrap:wrap;margin-top:36px}
.hero-actions .btn{margin-top:0;display:inline-flex;align-items:center}
.btn{
  display:inline-block;font-family:var(--util);letter-spacing:.18em;text-transform:uppercase;
  border:1px solid var(--brass);color:var(--brass-bright);padding:14px 34px;transition:.3s;
  background:transparent;cursor:pointer;font-size:1rem;
}
.btn:hover{background:var(--brass);color:var(--ink)}


/* スクロール誘導 */
.scroll-hint{
  position:absolute;bottom:34px;left:50%;transform:translateX(-50%);z-index:2;
  font-family:var(--util);letter-spacing:.25em;font-size:.7rem;color:var(--brass);
  text-transform:uppercase;
}
.scroll-hint::after{content:"";display:block;width:1px;height:38px;background:var(--brass);margin:10px auto 0;animation:drop 2.4s ease-in-out infinite}
@keyframes drop{0%,100%{opacity:.2;transform:scaleY(.4);transform-origin:top}50%{opacity:1;transform:scaleY(1);transform-origin:top}}

/* ============================================================
   セクション共通
   ============================================================ */
.section{padding:110px 0}
.section-head{margin-bottom:56px;max-width:62ch}
.section-lead{margin-top:20px;color:var(--muted);line-height:1.95;max-width:56ch}
.light .section-lead{color:var(--paper-muted)}
.light .info-block .val a{border-bottom:1px solid var(--paper-line);transition:.25s}
.light .info-block .val a:hover{border-bottom-color:var(--brass-deep);color:var(--brass-deep)}
.ph-text{color:var(--muted);font-family:var(--util);letter-spacing:.2em;font-size:.85rem}
.section-head h2{font-family:var(--display);font-weight:500;font-size:clamp(2rem,4vw,3.2rem);line-height:1.15;margin-top:14px}
.light{background:var(--paper);color:var(--ink)}
.light .eyebrow{color:var(--brass-deep)}
.light .section-head h2{color:var(--ink)}

/* ── 会社説明 ── */
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
.about-grid .media{aspect-ratio:4/3;background:var(--steel);border:1px solid var(--line);overflow:hidden;display:flex;align-items:center;justify-content:center;color:var(--muted);font-family:var(--util);letter-spacing:.2em}
.about-grid .media img{width:100%;height:100%;object-fit:cover}
.about-text p{margin-bottom:20px;color:#c6c8ca;line-height:1.95}
.about-text p:last-child{margin-bottom:0}
.light .about-text p{color:var(--paper-text)}

/* ── サービス ── */
.services{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.services.cols-1{grid-template-columns:1fr}
.services.cols-2{grid-template-columns:repeat(2,1fr)}
.service{background:var(--ink);padding:44px 32px;transition:.3s}
.light .service{background:var(--paper)}
.service:hover{background:var(--steel)}
.light .service:hover{background:var(--paper-soft)}
.service .num{font-family:var(--util);color:var(--brass);font-size:.85rem;letter-spacing:.2em}
.service h3{font-family:var(--display);font-size:1.6rem;font-weight:500;margin:14px 0 12px}
.service p{font-size:.95rem;color:var(--muted);line-height:1.9}

/* ============================================================
   販売車両カード
   ============================================================ */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.card{display:block;transition:.35s}
.card:hover{transform:translateY(-6px)}
.card .thumb{
  aspect-ratio:4/3;background:var(--steel);border:1px solid var(--line);
  overflow:hidden;position:relative;
}
.light .card .thumb{background:var(--paper-soft);border-color:var(--paper-line)}
.light .services{background:var(--paper-line);border-color:var(--paper-line)}
.light .service .num{color:var(--brass-deep)}
.card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.card:hover .thumb img{transform:scale(1.06)}
.card .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-family:var(--util);letter-spacing:.18em;font-size:.85rem}
.card h3{font-family:var(--display);font-size:1.35rem;font-weight:500;margin:16px 0 6px}
.card .meta{font-family:var(--util);letter-spacing:.14em;color:var(--brass);font-size:.85rem;text-transform:uppercase}
.light .card .meta{color:var(--brass-deep)}
.card .price{font-family:var(--util);letter-spacing:.08em;font-size:1.05rem;margin-top:4px}

/* SOLD OUT のかぶせ表示 */
.sold-overlay{position:absolute;inset:0;background:rgba(240,240,238,.36);display:flex;align-items:center;justify-content:center;z-index:2}
.sold-label{
  background:#8c2f34;color:#fff;font-family:var(--util);
  letter-spacing:.24em;text-transform:uppercase;font-size:1.1rem;
  padding:8px 30px;transform:rotate(-8deg);
  box-shadow:0 4px 18px rgba(0,0,0,.35);
}
.card.sold h3,.card.sold .meta{opacity:.6}
.card.sold:hover{transform:none}
.card.sold:hover .thumb img{transform:none}

/* 準備中のラベル */
.prep-tag{
  position:absolute;left:12px;top:12px;z-index:3;
  background:rgba(72,76,80,.92);color:var(--paper);
  font-family:var(--util);letter-spacing:.2em;font-size:.75rem;
  padding:5px 14px;
}
.card.preparing .thumb{filter:saturate(.85)}
.card.preparing .thumb::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(rgba(16,17,19,0),rgba(16,17,19,.28));
  pointer-events:none;
}

.no-vehicle{color:var(--muted);font-family:var(--util);letter-spacing:.16em;padding:40px 0}

/* ── 絞り込みタブ ── */
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:34px}
.filter-btn{
  font-family:var(--util);letter-spacing:.16em;text-transform:uppercase;font-size:.85rem;
  border:1px solid var(--paper-line);background:transparent;color:var(--paper-text);padding:8px 20px;cursor:pointer;transition:.25s;
}
.filter-btn:hover{border-color:var(--brass-deep);color:var(--ink)}
.filter-btn.active{background:var(--brass-deep);border-color:var(--brass-deep);color:var(--paper)}

/* ============================================================
   車両詳細ページ
   ============================================================ */
.vehicle-single{padding:154px 0 110px}
.vehicle-head{margin-bottom:44px}
.vehicle-head h1{font-family:var(--display);font-weight:500;font-size:clamp(2rem,4vw,3rem);margin-top:12px}
.vehicle-layout{display:grid;grid-template-columns:1.3fr .7fr;gap:56px;align-items:start}
.vehicle-main-img{border:1px solid var(--line);position:relative;overflow:hidden}
.vehicle-main-img img{width:100%;height:auto}
.vehicle-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px}
.vehicle-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--line);cursor:pointer;transition:.25s}
.vehicle-gallery img:hover{opacity:.75}
.spec-table{width:100%;border-collapse:collapse;margin-bottom:30px}
.spec-table th,.spec-table td{text-align:left;padding:13px 0;border-bottom:1px solid var(--line);font-size:.98rem}
.spec-table th{font-family:var(--util);letter-spacing:.16em;text-transform:uppercase;color:var(--brass);font-weight:500;width:38%}
.vehicle-body{margin:30px 0;color:#c6c8ca}
.vehicle-body p{margin-bottom:16px}
.back-link{display:inline-block;margin-top:40px;font-family:var(--util);letter-spacing:.16em;text-transform:uppercase;color:var(--brass);border-bottom:1px solid var(--line);padding-bottom:3px}
.back-link:hover{border-bottom-color:var(--brass)}

/* ============================================================
   お問い合わせ
   ============================================================ */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.info-block{margin-bottom:30px}
.info-block .label{font-family:var(--util);letter-spacing:.2em;text-transform:uppercase;color:var(--brass);font-size:.82rem;margin-bottom:6px}
.info-block .val{font-size:1.05rem}
.info-block .sub{color:var(--muted);font-size:.9rem}
.light .info-block .label{color:var(--brass-deep)}
.light .info-block .sub{color:var(--paper-muted)}

.cac-form{display:flex;flex-direction:column;gap:18px}
.cac-form label{font-family:var(--util);letter-spacing:.12em;text-transform:uppercase;font-size:.8rem;color:var(--brass);display:block;margin-bottom:4px}
.light .cac-form label{color:var(--brass-deep)}
.cac-form input,.cac-form textarea{
  width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);
  color:var(--paper);padding:10px 2px;font-family:var(--body);font-size:1rem;
}
.light .cac-form input,.light .cac-form textarea{color:var(--ink);border-bottom-color:var(--paper-line)}
.cac-form input:focus,.cac-form textarea:focus{outline:none;border-bottom-color:var(--brass)}
.light .cac-form input:focus,.light .cac-form textarea:focus{border-bottom-color:var(--brass-deep)}
.cac-form button{
  align-self:flex-start;margin-top:10px;font-family:var(--util);letter-spacing:.18em;text-transform:uppercase;
  background:var(--brass);color:var(--ink);border:0;padding:14px 40px;cursor:pointer;transition:.3s;font-size:1rem;
}
.cac-form button:hover{background:var(--brass-bright)}
.hp-field{position:absolute!important;left:-9999px!important}
.form-notice{padding:14px 18px;border-left:3px solid var(--brass);background:rgba(194,160,104,.14);margin-bottom:22px;font-size:.95rem}
.form-notice.error{border-left-color:#8c2f34;background:rgba(140,47,52,.1)}

/* ============================================================
   動画の再生ボタン・再生窓
   ============================================================ */

/* ヒーローの「本編を見る」ボタン */
.play-btn{
  display:inline-flex;align-items:center;gap:14px;
  margin:0;padding:13px 30px;
  background:rgba(240,240,238,.06);border:1px solid var(--line);
  color:var(--paper);font-family:var(--util);letter-spacing:.16em;text-transform:uppercase;
  font-size:1rem;cursor:pointer;transition:.3s;backdrop-filter:blur(4px);
  text-decoration:none;
}
.play-btn:hover{background:rgba(194,160,104,.20);border-color:var(--brass)}
.play-btn small{display:block;font-size:.62rem;letter-spacing:.2em;color:var(--brass);text-transform:none;margin-top:2px}

/* 三角の再生マーク */
.play-icon{
  width:0;height:0;flex:0 0 auto;
  border-left:14px solid var(--brass-bright);
  border-top:9px solid transparent;
  border-bottom:9px solid transparent;
}

/* 車両詳細：写真の上に重なる再生ボタン */
.play-overlay{
  position:absolute;inset:0;z-index:3;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  background:linear-gradient(rgba(16,17,19,.15),rgba(16,17,19,.5));
  border:0;cursor:pointer;color:var(--paper);transition:.3s;text-decoration:none;
}
.play-overlay:hover{background:linear-gradient(rgba(16,17,19,.25),rgba(16,17,19,.62))}
.play-overlay .play-icon{
  border-left-width:26px;border-top-width:17px;border-bottom-width:17px;
  border-left-color:var(--paper);
  filter:drop-shadow(0 3px 10px rgba(0,0,0,.5));
}
.play-overlay:hover .play-icon{border-left-color:var(--brass-bright)}
.play-text{font-family:var(--util);letter-spacing:.2em;text-transform:uppercase;font-size:1rem;text-shadow:0 2px 10px rgba(0,0,0,.6)}
.play-text small{display:block;font-size:.66rem;letter-spacing:.2em;color:var(--brass-bright);text-transform:none;margin-top:3px}

/* カードの隅に出る小さな動画マーク */
.has-video{
  position:absolute;right:12px;bottom:12px;z-index:3;
  width:34px;height:34px;border-radius:50%;
  background:rgba(16,17,19,.66);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;
}
.has-video::after{
  content:"";width:0;height:0;margin-left:3px;
  border-left:11px solid var(--paper);
  border-top:7px solid transparent;
  border-bottom:7px solid transparent;
}

/* 再生窓（押されるまで中身は空） */
.video-modal{
  position:fixed;inset:0;z-index:9999;
  background:rgba(12,13,15,.95);
  display:none;align-items:center;justify-content:center;padding:28px;
}
.video-modal.open{display:flex}
.video-frame{width:min(1100px,100%);aspect-ratio:16/9;background:#000}
.video-frame iframe{width:100%;height:100%;border:0;display:block}
.video-error{
  width:100%;height:100%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:12px;
  color:var(--paper);font-family:var(--body);text-align:center;padding:20px;
}
.video-error a{color:var(--brass-bright);border-bottom:1px solid var(--line);padding-bottom:2px}
.video-close{
  position:absolute;top:20px;right:22px;z-index:10;
  width:52px;height:52px;border-radius:50%;
  background:rgba(38,40,43,.9);border:1px solid var(--line);
  color:var(--paper);font-size:2rem;line-height:1;
  cursor:pointer;transition:.25s;
  display:flex;align-items:center;justify-content:center;
  backdrop-filter:blur(4px);
  box-shadow:0 4px 18px rgba(0,0,0,.5);
}
.video-close:hover{background:var(--brass);color:var(--ink);border-color:var(--brass)}

/* 「閉じる」の文字。押す場所だと一目で分かるように */
.video-hint{
  position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:10;
  font-family:var(--util);letter-spacing:.2em;text-transform:uppercase;
  font-size:.74rem;color:var(--muted);pointer-events:none;
}

@media(max-width:880px){
  .video-close{top:12px;right:12px;width:46px;height:46px;font-size:1.7rem}
  .video-hint{bottom:16px;font-size:.68rem}
}

@media(max-width:880px){
  .hero-actions{flex-direction:column;gap:12px}
  .hero-actions .btn,.play-btn{width:100%;justify-content:center;text-align:center}
  .video-modal{padding:16px}
}

/* ============================================================
   送信前の確認ダイアログ
   ============================================================ */
.cac-dialog{
  position:fixed;inset:0;z-index:9998;
  background:rgba(12,13,15,.92);
  display:none;align-items:center;justify-content:center;padding:24px;
}
.cac-dialog.open{display:flex}
.dialog-inner{
  background:var(--ink);border:1px solid var(--line);
  max-width:620px;width:100%;max-height:86vh;overflow-y:auto;
  padding:44px 42px;
}
.dialog-inner h3{
  font-family:var(--display);font-weight:500;font-size:1.9rem;
  margin:12px 0 30px;color:var(--paper);line-height:1.4;
}
.confirm-list{display:grid;grid-template-columns:auto 1fr;gap:0;margin-bottom:34px}
.confirm-list dt{
  font-family:var(--util);letter-spacing:.16em;text-transform:uppercase;
  color:var(--brass);font-size:.78rem;
  padding:14px 22px 14px 0;border-bottom:1px solid var(--line);
  white-space:nowrap;
}
.confirm-list dd{
  padding:14px 0;border-bottom:1px solid var(--line);
  color:var(--paper);font-size:.98rem;white-space:pre-wrap;line-height:1.8;
}
.dialog-actions{display:flex;gap:14px;justify-content:flex-end;flex-wrap:wrap}
.btn.ghost{border-color:var(--line);color:var(--muted)}
.btn.ghost:hover{background:transparent;border-color:var(--brass);color:var(--brass-bright)}
.btn.solid{background:var(--brass);color:var(--ink);border-color:var(--brass)}
.btn.solid:hover{background:var(--brass-bright);border-color:var(--brass-bright)}
.btn:disabled{opacity:.6;cursor:default}

/* ============================================================
   送信結果の看板
   ── 工房の壁に掛かった真鍮の銘板を思わせる見た目 ──
   ============================================================ */
.cac-signboard{
  position:fixed;inset:0;z-index:10000;
  background:rgba(12,13,15,.94);
  display:none;align-items:center;justify-content:center;padding:24px;
}
.cac-signboard.open{display:flex;animation:signFade .5s ease}
@keyframes signFade{from{opacity:0}to{opacity:1}}

.sign-plate{
  position:relative;
  background:linear-gradient(155deg,#33363a,#212326 55%,#171819);
  border:1px solid var(--brass);
  box-shadow:0 24px 70px rgba(0,0,0,.7), inset 0 1px 0 rgba(214,181,126,.22);
  padding:60px 56px 48px;
  max-width:540px;width:100%;text-align:center;
  animation:signDrop .6s cubic-bezier(.2,.8,.25,1);
}
@keyframes signDrop{
  from{transform:translateY(-22px) rotate(-.6deg);opacity:0}
  to{transform:none;opacity:1}
}
/* 四隅のリベット */
.sign-rivet{
  position:absolute;width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #ddc599, #8f7845 60%, #4d4330);
  box-shadow:0 1px 2px rgba(0,0,0,.6);
}
.sign-rivet.tl{left:14px;top:14px}
.sign-rivet.tr{right:14px;top:14px}
.sign-rivet.bl{left:14px;bottom:14px}
.sign-rivet.br{right:14px;bottom:14px}

.sign-en{
  display:block;font-family:var(--util);
  letter-spacing:.42em;text-transform:uppercase;
  font-size:.82rem;color:var(--brass-bright);
  padding-bottom:20px;margin-bottom:22px;
  border-bottom:1px solid var(--line);
}
.sign-plate h3{
  font-family:var(--display);font-weight:500;
  font-size:2.4rem;color:var(--paper);margin-bottom:20px;line-height:1.35;
}
.sign-plate p{color:#c0c3c6;font-size:.98rem;line-height:2;margin-bottom:34px}
.sign-plate p a{color:var(--brass-bright);border-bottom:1px solid var(--line)}
.sign-plate .btn{border-color:var(--line)}
.sign-plate.warn{border-color:#7d3a40}
.sign-plate.warn .sign-en{color:#c99097}

@media(max-width:640px){
  .dialog-inner{padding:32px 24px}
  .dialog-inner h3{font-size:1.5rem}
  .confirm-list{grid-template-columns:1fr;gap:0}
  .confirm-list dt{border-bottom:0;padding:14px 0 2px}
  .confirm-list dd{padding:0 0 14px}
  .dialog-actions .btn{flex:1;text-align:center}
  .sign-plate{padding:44px 26px 36px}
  .sign-plate h3{font-size:1.8rem}
}

/* ============================================================
   マーキー
   ============================================================ */
.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0;background:var(--ink)}
.marquee .track{display:flex;gap:40px;white-space:nowrap;font-family:var(--display);font-size:1.6rem;letter-spacing:.1em;color:var(--brass);animation:scroll 34s linear infinite;width:max-content}
@keyframes scroll{to{transform:translateX(-50%)}}

/* ============================================================
   フッター
   ============================================================ */
.site-footer{background:#141517;padding:64px 0 36px;border-top:1px solid var(--line)}
.foot-grid{display:flex;justify-content:space-between;flex-wrap:wrap;gap:34px;align-items:center}
.socials{display:flex;gap:18px;font-family:var(--util);letter-spacing:.12em;text-transform:uppercase;font-size:.85rem}
.socials a{color:var(--muted);transition:.25s}
.socials a:hover{color:var(--brass)}
.copy{margin-top:22px;color:var(--muted);font-size:.82rem;font-family:var(--util);letter-spacing:.1em;line-height:1.9}

/* ============================================================
   スクロールで浮かび上がる演出
   ============================================================ */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s ease}
.reveal.visible{opacity:1;transform:none}

/* ============================================================
   レスポンシブ
   ============================================================ */
@media(max-width:880px){
  .burger{display:flex}
  /* 狭い画面ではロゴを優先し、横の文字は隠します */
  .brand:has(.site-logo) .brand-name,
  .brand:has(.custom-logo) .brand-name{display:none}
  .brand{gap:10px;font-size:1.15rem}
  .foot-brand{gap:12px}
  .menu{
    position:fixed;inset:0;background:rgba(16,17,19,.975);
    flex-direction:column;justify-content:center;align-items:center;gap:26px;
    font-size:1.3rem;transform:translateX(100%);transition:transform .4s ease;z-index:110;
  }
  .menu.open{transform:none}
  .about-grid,.contact-grid,.vehicle-layout{grid-template-columns:1fr;gap:36px}
  .services{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr 1fr}
  .vehicle-gallery{grid-template-columns:repeat(3,1fr)}
  .section{padding:72px 0}
  .hero{height:88vh;min-height:520px}
  /* 縦長画面では、動画の中央がきちんと見えるように */
  .hero video.hero-media{object-position:center}
  .vehicle-single{padding:120px 0 72px}
}
@media(max-width:540px){
  .cards{grid-template-columns:1fr}
  .wrap{padding:0 20px}
}

/* 動きを減らす設定の端末に配慮 */
@media(prefers-reduced-motion:reduce){
  .marquee .track,.scroll-hint::after{animation:none}
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}