/*
Theme Name: Centurion
Theme URI: https://bloomcapital.jp/
Author: 株式会社ブルームキャピタル
Description: 会員制レストラン「CENTURION」向けの黒基調テーマ。トップページはアクセス・電話番号のみを公開し、パスワード認証（サーバー側）を通過した会員だけに会員ページを表示します。那須高原・完全予約制。
Version: 1.5.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: centurion
*/

:root{
  --void:#08090b;
  --ink:#0c0d10;
  --card-a:#14161b;
  --card-b:#0a0b0e;
  --platinum:#cfd3d6;
  --platinum-bright:#eef1f2;
  --platinum-dim:#868b90;
  --platinum-mute:#5a5f64;
  --line:rgba(207,211,214,.20);
  --line-soft:rgba(207,211,214,.10);
  --ff-display:"Cinzel",serif;
  --ff-util:"Jost",sans-serif;
  --ff-jp:"Shippori Mincho",serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--void);color:var(--platinum);
  font-family:var(--ff-jp);line-height:1.9;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
::selection{background:rgba(207,211,214,.2)}
img{max-width:100%;display:block}

/* ======================= 入口ゲート ======================= */
.gate{
  min-height:100svh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;padding:3rem 1.4rem;position:relative;
}
.gate::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(90% 55% at 50% -8%, rgba(120,128,134,.10), transparent 62%),
    radial-gradient(70% 50% at 50% 120%, rgba(90,96,102,.06), transparent 70%);
}
.gate-eyebrow{
  font-family:var(--ff-util);font-weight:400;font-size:.68rem;
  letter-spacing:.52em;text-transform:uppercase;color:var(--platinum-mute);
  margin-bottom:1.6rem;position:relative;opacity:0;animation:rise .9s .1s forwards;
}
.card{
  position:relative;width:min(90vw,500px);
  background:linear-gradient(158deg,var(--card-a),var(--card-b) 60%);
  border:1px solid var(--line);border-radius:6px;
  padding:3.2rem 2.6rem 2.6rem;text-align:center;
  box-shadow:0 40px 90px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.04);
  opacity:0;animation:rise 1s .28s forwards;
}
.card::after{
  content:"";position:absolute;inset:0;border-radius:6px;pointer-events:none;
  background:linear-gradient(120deg,transparent 30%,rgba(238,241,242,.05) 48%,transparent 62%);
}
.emblem{width:74px;height:74px;margin:0 auto 1.4rem;display:block}
.wordmark{
  font-family:var(--ff-display);font-weight:500;
  font-size:clamp(1.9rem,7vw,2.5rem);letter-spacing:.34em;
  color:var(--platinum-bright);line-height:1;margin-left:.34em;
  text-shadow:0 1px 1px rgba(0,0,0,.6);
}
.card-sub{
  font-family:var(--ff-util);font-size:.64rem;letter-spacing:.42em;
  text-transform:uppercase;color:var(--platinum-mute);margin-top:1rem;
}
.metal-rule{height:1px;width:60px;margin:1.8rem auto;background:linear-gradient(90deg,transparent,var(--platinum-dim),transparent)}
.access-block{font-size:.9rem;line-height:2.1;color:var(--platinum);letter-spacing:.06em}
.access-block .lbl{font-family:var(--ff-util);font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;color:var(--platinum-mute);display:block;margin-bottom:.3rem}
.access-block .tel{font-family:var(--ff-display);font-size:1.5rem;letter-spacing:.12em;color:var(--platinum-bright);display:block;margin-top:.4rem}
.ph{color:var(--platinum-dim);font-style:italic}

.gate-form{margin-top:2.2rem;padding-top:1.8rem;border-top:1px solid var(--line-soft)}
.gate-form .field-lbl{font-family:var(--ff-util);font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;color:var(--platinum-mute);display:block;margin-bottom:1rem}
.gate-row{display:flex;gap:.7rem;justify-content:center;align-items:stretch}
.gate-input{flex:1;max-width:240px;background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--platinum-bright);font-family:var(--ff-util);font-size:.95rem;letter-spacing:.18em;padding:.6rem .4rem;text-align:center;outline:none;transition:border-color .4s}
.gate-input:focus{border-color:var(--platinum)}
.gate-input::placeholder{color:var(--platinum-mute);letter-spacing:.3em}
.gate-btn{background:transparent;border:1px solid var(--line);border-radius:2px;color:var(--platinum);font-family:var(--ff-util);font-weight:400;font-size:.72rem;letter-spacing:.28em;padding:.6rem 1.3rem;cursor:pointer;transition:background .4s,color .4s,border-color .4s}
.gate-btn:hover{background:var(--platinum-bright);color:var(--void);border-color:var(--platinum-bright)}
.gate-error{color:#c98b8b;font-family:var(--ff-util);font-size:.74rem;letter-spacing:.1em;margin-top:1rem;min-height:1rem}
.gate-foot{margin-top:2.4rem;font-family:var(--ff-util);font-size:.62rem;letter-spacing:.34em;text-transform:uppercase;color:var(--platinum-mute);position:relative;opacity:0;animation:rise 1s .5s forwards}

@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* ======================= 会員ページ ======================= */
.m-nav{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:1.1rem clamp(1.2rem,5vw,3rem);background:rgba(8,9,11,.82);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft)}
.m-brand{font-family:var(--ff-display);font-weight:500;font-size:1.05rem;letter-spacing:.3em;color:var(--platinum-bright);padding-left:.3em;text-decoration:none}
.m-links{display:flex;gap:2rem;list-style:none}
.m-links a{font-family:var(--ff-util);font-weight:300;font-size:.76rem;letter-spacing:.2em;color:var(--platinum);text-decoration:none;opacity:.8;transition:.3s}
.m-links a:hover{opacity:1;color:var(--platinum-bright)}
.m-logout{background:none;border:1px solid var(--line);border-radius:2px;color:var(--platinum-dim);font-family:var(--ff-util);font-size:.66rem;letter-spacing:.24em;padding:.45rem 1rem;cursor:pointer;transition:.3s}
.m-logout:hover{color:var(--platinum-bright);border-color:var(--platinum-dim)}

.band{padding:clamp(4.5rem,11vw,8rem) clamp(1.4rem,6vw,3.4rem)}
.wrap{max-width:1120px;margin:0 auto}
.band-head{margin-bottom:3.2rem}
.eyebrow{font-family:var(--ff-util);font-weight:400;font-size:.68rem;letter-spacing:.42em;text-transform:uppercase;color:var(--platinum-dim);display:block;margin-bottom:1.1rem}
.band-title{font-family:var(--ff-display);font-weight:400;font-size:clamp(1.8rem,4.6vw,2.8rem);letter-spacing:.08em;color:var(--platinum-bright);line-height:1.2}
.band-title em{font-style:italic;color:var(--platinum-dim)}

.concept{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2.4rem,6vw,5rem);align-items:center}
.concept .lead{font-family:var(--ff-display);font-style:italic;font-size:1.45rem;line-height:1.6;color:var(--platinum);letter-spacing:.02em;margin-bottom:1.8rem;max-width:24ch}
.concept p{font-size:1rem;line-height:2.3;color:var(--platinum-dim);margin-bottom:1.4rem;max-width:44ch}
.concept p:last-child{margin-bottom:0}

.frame{position:relative;padding:12px}
.frame::before,.frame::after{content:"";position:absolute;width:22px;height:22px;border:1px solid var(--platinum-dim)}
.frame::before{top:0;left:0;border-right:0;border-bottom:0}
.frame::after{bottom:0;right:0;border-left:0;border-top:0}
.photo{aspect-ratio:4/5;width:100%;display:flex;align-items:flex-end;justify-content:center;background:linear-gradient(160deg,#1c1e23,#0d0e11);position:relative;border:1px solid var(--line-soft)}
.photo::after{content:"— 料理写真 —";font-family:var(--ff-display);font-style:italic;font-size:.86rem;letter-spacing:.1em;color:var(--platinum-mute);padding-bottom:1.3rem}
.photo--room::after{content:"— ダイニング —"}
.photo--terrace::after{content:"— テラス／森 —"}
.photo--private::after{content:"— 個室 —"}

.menu-intro{max-width:52ch;color:var(--platinum-dim);font-size:1rem;line-height:2.2;margin-bottom:3.4rem}
.courses{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,3.2rem)}
.course{border-top:1px solid var(--line);padding-top:1.7rem}
.course-price{font-family:var(--ff-display);font-weight:400;font-size:2rem;letter-spacing:.04em;color:var(--platinum-bright);line-height:1}
.course-price small{font-size:.9rem;letter-spacing:.14em;color:var(--platinum-mute);margin-left:.4rem}
.course-name{font-family:var(--ff-display);font-style:italic;font-size:1.25rem;color:var(--platinum);margin:.9rem 0 .5rem;letter-spacing:.03em}
.course-jp{font-size:.9rem;color:var(--platinum-dim);letter-spacing:.06em;margin-bottom:1.2rem}
.course ul{list-style:none;font-size:.9rem;color:var(--platinum-dim);line-height:2}
.course ul li{position:relative;padding-left:1.1rem}
.course ul li::before{content:"·";position:absolute;left:.2rem;color:var(--platinum-mute)}
.menu-note{margin-top:3.2rem;padding-top:1.7rem;border-top:1px solid var(--line);font-size:.82rem;color:var(--platinum-mute);letter-spacing:.05em;line-height:2;max-width:60ch}

.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2.4vw,1.5rem)}
.gallery .frame{padding:9px}
.gallery .photo{aspect-ratio:3/4}
.space-lead{max-width:50ch;color:var(--platinum-dim);font-size:1rem;line-height:2.3;margin-bottom:3.2rem}

.reserve{text-align:center;background:radial-gradient(100% 90% at 50% 0%, rgba(90,96,102,.06), transparent 65%),var(--void)}
.reserve p{max-width:44ch;margin:0 auto 2.6rem;color:var(--platinum-dim);font-size:1rem;line-height:2.2}
.btn-reserve{display:inline-block;font-family:var(--ff-util);font-weight:400;font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;text-decoration:none;color:var(--platinum);border:1px solid var(--line);border-radius:2px;padding:1.1rem 3rem;transition:.4s}
.btn-reserve:hover{background:var(--platinum-bright);color:var(--void);border-color:var(--platinum-bright)}
.reserve-tel{margin-top:2rem;font-family:var(--ff-display);font-size:1.5rem;letter-spacing:.1em;color:var(--platinum-bright)}

.m-foot{background:#060709;border-top:1px solid var(--line-soft);padding:2.8rem clamp(1.4rem,6vw,3.4rem);text-align:center}
.m-foot .fb{font-family:var(--ff-display);letter-spacing:.3em;font-size:1rem;color:var(--platinum)}
.m-foot .fm{font-family:var(--ff-util);font-weight:300;font-size:.7rem;letter-spacing:.16em;color:var(--platinum-mute);line-height:2;margin-top:.8rem}

.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s,transform .9s}
.reveal.in{opacity:1;transform:none}

@media (max-width:820px){
  .m-links{display:none}
  .concept,.courses{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr;max-width:400px;margin:0 auto}
  .concept .frame{max-width:400px;margin:0 auto}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .gate-eyebrow,.card,.gate-foot{opacity:1}
  .reveal{opacity:1;transform:none}
}

/* ======================= ゲートの一文 ======================= */
.gate-intro{
  font-size:.9rem;line-height:2.05;color:var(--platinum);
  letter-spacing:.03em;max-width:29em;margin:.2rem auto 1.1rem;text-wrap:balance;
}
.gate-guide{
  display:inline-block;font-family:var(--ff-util);font-size:.72rem;letter-spacing:.24em;
  color:var(--platinum-dim);text-decoration:none;border-bottom:1px solid var(--platinum-mute);
  padding-bottom:2px;transition:color .3s,border-color .3s;
}
.gate-guide:hover{color:var(--platinum-bright);border-color:var(--platinum-bright)}
.gate-intro a{
  color:var(--platinum-bright);text-decoration:none;white-space:nowrap;
  border-bottom:1px solid var(--platinum-dim);padding-bottom:1px;transition:border-color .3s,color .3s;
}
.gate-intro a:hover{color:var(--platinum-bright);border-color:var(--platinum-bright)}

/* ======================= はじめての方へ ======================= */
.guide{
  min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:4rem 1.5rem;text-align:center;position:relative;
}
.guide::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(90% 55% at 50% -8%, rgba(120,128,134,.10), transparent 62%);
}
.guide-inner{position:relative;max-width:520px;width:100%}
.guide-back{
  display:inline-block;font-family:var(--ff-util);font-weight:400;letter-spacing:.16em;font-size:.78rem;
  color:var(--platinum-dim);text-decoration:none;transition:color .3s;margin-bottom:.6rem;
}
.guide-back:hover{color:var(--platinum-bright)}
.guide h1{
  font-family:var(--ff-display);font-weight:400;font-size:1.7rem;letter-spacing:.1em;
  color:var(--platinum-bright);margin:2.6rem 0 0;
}
.guide-rule{height:1px;width:56px;margin:1.6rem auto 2.4rem;background:linear-gradient(90deg,transparent,var(--platinum-dim),transparent)}
.guide-block{margin-bottom:1.9rem}
.guide-label{
  font-family:var(--ff-util);font-size:.62rem;letter-spacing:.34em;text-transform:uppercase;
  color:var(--platinum-mute);display:block;margin-bottom:.55rem;
}
.guide-val{font-size:1rem;line-height:1.9;color:var(--platinum);letter-spacing:.04em}
.guide-tel{font-family:var(--ff-display);font-size:1.5rem;letter-spacing:.1em;color:var(--platinum-bright);text-decoration:none}
.guide-map{
  display:inline-block;margin-top:1.4rem;font-family:var(--ff-jp);font-size:.92rem;letter-spacing:.12em;
  color:var(--platinum);text-decoration:none;border:1px solid var(--line);border-radius:2px;
  padding:.9rem 2rem;transition:background .4s,color .4s,border-color .4s;
}
.guide-map:hover{background:var(--platinum-bright);color:var(--void);border-color:var(--platinum-bright)}
.guide-warn{
  font-size:.82rem;line-height:1.95;color:var(--platinum-dim);letter-spacing:.03em;
  max-width:40ch;margin:2.4rem auto 0;padding-top:1.6rem;border-top:1px solid var(--line-soft);
}

/* ======================= 追加セクション（Steak / Pasta）======================= */
.photo--steak::after{content:"— ステーキ —"}
.photo--pasta::after{content:"— パスタ —"}
.concept--rev .frame{order:-1}
@media (max-width:820px){ .concept--rev .frame{order:0} }

/* ======================= 写真を実画像で表示 ======================= */
.photo{background-size:cover;background-position:center;background-repeat:no-repeat}
.photo::after,
.photo--room::after,.photo--terrace::after,.photo--private::after,
.photo--steak::after,.photo--pasta::after{content:none}

/* ロゴ画像（アップ時） */
.emblem-img{width:auto;height:auto;max-width:160px;max-height:92px;margin:0 auto 1.4rem;display:block;object-fit:contain}

/* ======================= 言語スイッチ ======================= */
.lang-switch{margin-top:2.2rem;font-family:var(--ff-util);font-size:.82rem;letter-spacing:.2em;color:var(--platinum-dim);text-align:center}
.lang-switch a{color:var(--platinum-dim);text-decoration:none;padding:0 .7em;transition:color .3s}
.lang-switch a:hover{color:var(--platinum-bright)}
.lang-switch .lang-en{color:var(--platinum-bright)}
.lang-switch a.on{border-bottom:1px solid var(--platinum-mute);padding-bottom:3px}
.lang-switch span{opacity:.4}
.m-nav .lang-switch{margin:0;font-size:.66rem}
.m-nav .lang-switch a{padding:0 .5em}
.guide .lang-switch{margin-top:2.6rem}