/* ===== ノーブルリッチ 営業デモ スタイル ===== */
:root{
  --base:#0B0E17;
  --surface:#141A2B;
  --surface2:#1C2440;
  --neon:#2EE6C8;
  --magenta:#FF3D9A;
  --gold:#E0A93B;
  --text:#E8EAF0;
  --sub:#A0A7BD;
  --maxw:1200px;
  --gut:24px;
  --pad-sec:120px;
  --sans:'Zen Kaku Gothic New',sans-serif;
  --serif:'Playfair Display',serif;
  --en:'Inter',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--base);
  color:var(--text);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-weight:500;line-height:1.3}

/* ---- 共通セクション ---- */
.section{
  max-width:var(--maxw);
  margin:0 auto;
  padding:var(--pad-sec) var(--gut);
}
.en-eyebrow{
  font-family:var(--en);
  font-size:13px;
  letter-spacing:.3em;
  color:var(--neon);
  text-transform:uppercase;
  margin-bottom:18px;
}
.section h2{
  font-size:clamp(26px,4vw,36px);
  margin-bottom:28px;
}
.lead,.section p{color:var(--text)}
.lead.center{text-align:center;margin-left:auto;margin-right:auto;max-width:680px}
.note{color:var(--sub);margin-top:18px;font-size:15px}
.note a{color:var(--neon);border-bottom:1px solid rgba(46,230,200,.4)}
.placeholder-note{color:var(--sub);font-size:13px;margin-top:22px}

/* ---- ボタン ---- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--en);font-weight:500;letter-spacing:.03em;
  border-radius:999px;cursor:pointer;
  transition:.25s ease;
}
.btn-primary{
  background:var(--neon);color:#06231D;
  padding:15px 32px;font-size:15px;
}
.btn-primary:hover{
  background:#54F0D6;transform:translateY(-2px);
  box-shadow:0 0 26px rgba(46,230,200,.5);
}
.btn-ghost{
  background:transparent;color:var(--neon);
  border:1px solid rgba(46,230,200,.6);
  padding:10px 20px;font-size:14px;
}
.btn-ghost:hover{background:rgba(46,230,200,.12)}
.tel-ico{width:16px;height:16px;display:inline-block;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.2.2 2.4.6 3.6.1.4 0 .8-.3 1z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.2.2 2.4.6 3.6.1.4 0 .8-.3 1z'/%3E%3C/svg%3E") center/contain no-repeat;}

/* ---- ヘッダー ---- */
#site-header{
  position:fixed;top:0;left:0;width:100%;z-index:100;
  transition:.3s ease;
}
.header-inner{
  max-width:var(--maxw);margin:0 auto;
  padding:18px var(--gut);
  display:flex;align-items:center;justify-content:space-between;
}
#site-header.scrolled{
  background:rgba(11,14,23,.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.brand{display:flex;flex-direction:column;line-height:1.1}
.brand-main{font-family:var(--en);font-weight:500;letter-spacing:.22em;font-size:18px}
.brand-sub{font-family:var(--serif);font-style:italic;font-size:12px;color:var(--neon)}
.gnav{display:flex;align-items:center;gap:26px}
.gnav a{font-family:var(--en);font-size:13px;letter-spacing:.12em;color:var(--text);opacity:.85;transition:.2s}
.gnav a:hover{opacity:1;color:var(--neon)}
.gnav .nav-tel{opacity:1}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px}
.hamburger span{width:26px;height:2px;background:var(--text);transition:.3s}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---- ヒーロー ---- */
.hero{position:relative;height:100vh;min-height:600px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.hero-bg{
  position:absolute;inset:0;
  background:url("https://images.unsplash.com/photo-1692455129277-90c4e69a3c7d?auto=format&fit=crop&w=1920&q=80") center/cover no-repeat;
  transform:scale(1.08);
  animation:heroZoom 14s ease-out forwards;
}
@keyframes heroZoom{to{transform:scale(1)}}
.hero-overlay{
  position:absolute;inset:0;
  background:
    radial-gradient(60% 60% at 50% 40%,rgba(46,230,200,.10),transparent 70%),
    radial-gradient(50% 50% at 80% 80%,rgba(255,61,154,.12),transparent 70%),
    linear-gradient(180deg,rgba(11,14,23,.55) 0%,rgba(11,14,23,.78) 100%);
}
.hero-content{position:relative;z-index:2;padding:0 20px;max-width:900px}
.hero-label{font-family:var(--en);font-size:13px;letter-spacing:.28em;color:var(--neon);margin-bottom:20px}
.hero-title{
  font-family:var(--serif);
  font-size:clamp(44px,9vw,82px);
  font-weight:500;letter-spacing:.01em;line-height:1.05;
  text-shadow:0 0 40px rgba(46,230,200,.25);
  margin-bottom:18px;
}
.hero-sub{font-size:clamp(16px,2.4vw,21px);color:#cfd4e4;margin-bottom:40px;letter-spacing:.04em}
.hero-cta{font-size:15px}
.scroll-cue{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);z-index:2}
.scroll-cue span{display:block;width:22px;height:36px;border:1.5px solid rgba(255,255,255,.5);border-radius:12px;position:relative}
.scroll-cue span::after{content:"";position:absolute;top:7px;left:50%;transform:translateX(-50%);width:3px;height:7px;border-radius:2px;background:var(--neon);animation:cue 1.6s infinite}
@keyframes cue{0%{opacity:0;transform:translate(-50%,0)}40%{opacity:1}100%{opacity:0;transform:translate(-50%,12px)}}

/* ---- CONCEPT ---- */
.concept{text-align:center}
.concept h2{margin-bottom:32px}
.concept .lead{font-size:17px;max-width:720px;margin:0 auto;color:#d6dae8}

/* ---- split (PLAY / DINING) ---- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split.reverse .split-media{order:2}
.split-media img{border-radius:16px;border:1px solid rgba(255,255,255,.07);box-shadow:0 18px 50px rgba(0,0,0,.5);width:100%;height:100%;object-fit:cover}
.dining-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dining-grid img{aspect-ratio:3/4}
.spec-list{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:24px 0}
.spec-list li{font-family:var(--en);font-size:13px;letter-spacing:.05em;padding:8px 16px;border:1px solid rgba(46,230,200,.35);border-radius:999px;color:var(--neon)}

/* ---- PRICE ---- */
.price{text-align:center}
.price-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;max-width:760px;margin:40px auto 0;text-align:left}
.price-card{position:relative;background:var(--surface);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:30px 32px;box-shadow:0 10px 30px rgba(0,0,0,.45)}
.price-card.featured{border-color:rgba(46,230,200,.5);box-shadow:0 0 30px rgba(46,230,200,.15)}
.ribbon{position:absolute;top:-12px;right:24px;background:var(--neon);color:#06231D;font-family:var(--en);font-size:12px;font-weight:500;padding:4px 14px;border-radius:999px}
.price-card h3{font-size:19px;margin-bottom:6px}
.price-meta{color:var(--sub);font-size:13px;margin-bottom:18px}
.price-card ul{list-style:none}
.price-card li{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0;border-top:1px solid rgba(255,255,255,.07)}
.price-card li:first-child{border-top:none}
.yen{font-family:var(--en);font-weight:500;font-size:22px;color:var(--gold)}

/* ---- GALLERY ---- */
.gallery{text-align:center}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.gallery-grid img{aspect-ratio:4/5;object-fit:cover;border-radius:14px;border:1px solid rgba(255,255,255,.07);transition:.4s}
.gallery-grid img:hover{transform:translateY(-4px);box-shadow:0 0 30px rgba(46,230,200,.2)}

/* ---- SCENE ---- */
.scene{text-align:center}
.scene-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:44px;text-align:left}
.scene-card{background:var(--surface);border:1px solid rgba(255,255,255,.07);border-radius:16px;overflow:hidden;transition:.3s}
.scene-card:hover{border-color:rgba(255,61,154,.4);transform:translateY(-4px)}
.scene-img{aspect-ratio:16/10;overflow:hidden}
.scene-img img{width:100%;height:100%;object-fit:cover;transition:.5s}
.scene-card:hover .scene-img img{transform:scale(1.05)}
.scene-text{padding:26px 28px 30px}
.scene-no{font-family:var(--serif);font-style:italic;font-size:30px;color:var(--magenta);display:block;margin-bottom:10px}
.scene-card h3{font-size:18px;margin-bottom:10px}
.scene-card p{color:#cfd4e4;font-size:15px}

/* ---- INFO ---- */
.info{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.info-list{margin-top:8px}
.info-list>div{display:grid;grid-template-columns:96px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.info-list dt{color:var(--neon);font-size:14px;font-weight:500}
.info-list dd{color:var(--text)}
.info-list a{color:var(--gold)}
.info-map{height:380px;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.1)}
.info-map iframe{width:100%;height:100%;border:0;filter:grayscale(.3) invert(.92) hue-rotate(180deg)}

/* ---- FOOTER CTA ---- */
.footer-cta{text-align:center;background:
  radial-gradient(60% 100% at 50% 0%,rgba(46,230,200,.10),transparent 70%);
  border-radius:24px;margin-top:40px;}
.footer-cta h2{font-size:clamp(24px,4vw,34px)}
.footer-cta p{color:#cfd4e4;margin:20px 0 36px}
.big-cta{font-size:17px;padding:18px 40px}

/* ---- フッター ---- */
.site-footer{text-align:center;padding:60px 20px 120px;border-top:1px solid rgba(255,255,255,.07)}
.f-brand{font-family:var(--en);letter-spacing:.25em;font-size:16px}
.f-sub{color:var(--sub);font-size:13px;margin-top:8px}
.f-copy{color:var(--sub);font-size:12px;margin-top:18px;opacity:.7}

/* ---- モバイル電話バー ---- */
.mobile-telbar{display:none}

/* ---- reveal アニメ ---- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* ===== レスポンシブ ===== */
@media(max-width:1024px){
  :root{--pad-sec:90px}
  .split{gap:40px}
}
@media(max-width:768px){
  :root{--pad-sec:72px}
  .gnav{
    position:fixed;top:0;right:0;height:100vh;width:74%;max-width:320px;
    flex-direction:column;justify-content:center;gap:28px;
    background:rgba(11,14,23,.97);backdrop-filter:blur(12px);
    transform:translateX(100%);transition:.35s ease;
    border-left:1px solid rgba(46,230,200,.2);
  }
  .gnav.open{transform:translateX(0)}
  .gnav a{font-size:16px}
  .hamburger{display:flex;z-index:120}
  .split,.info{grid-template-columns:1fr;gap:32px}
  .split.reverse .split-media{order:0}
  .dining-grid{grid-template-columns:1fr 1fr}
  .price-cards{grid-template-columns:1fr;max-width:420px}
  .gallery-grid{grid-template-columns:1fr 1fr}
  .scene-cards{grid-template-columns:1fr}
  .info-map{height:280px}
  body{padding-bottom:60px}
  .mobile-telbar{
    display:flex;align-items:center;justify-content:center;gap:10px;
    position:fixed;bottom:0;left:0;width:100%;height:60px;z-index:90;
    background:var(--neon);color:#06231D;font-weight:500;font-family:var(--sans);
    border-top:1px solid rgba(255,255,255,.2);
  }
}
@media(max-width:430px){
  .hero-title{font-size:clamp(40px,13vw,56px)}
  .gallery-grid{grid-template-columns:1fr}
  .section h2 br{display:none}
}
@media(prefers-reduced-motion:reduce){
  .hero-bg{animation:none;transform:none}
  .reveal{opacity:1;transform:none;transition:none}
  .scroll-cue span::after{animation:none}
}