/* ── RESET & ROOT ─────────────────────────── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --black:  #050505;
  --white:  #ede9e3;
  --grey:   #2a2a2a;
  --mid:    #555550;
  --dim:    #888880;
  --accent: #c4a97a;
  --red:    #b03a2a;
  --nav-h:  72px;
}
html { scroll-behavior: smooth; overflow-x: hidden; }
body {
  background: var(--black);
  color: var(--white);
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 100;
  letter-spacing: 0.06em;
  overflow-x: hidden;
}

/* ── NOISE ─────────────────────────────────── */
body::after {
  content:'';
  position:fixed; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events:none; z-index:9998; opacity:.35;
}

/* ── NAV ───────────────────────────────────── */
#nav {
  position: fixed; top:0; left:0; right:0; z-index:500;
  height: var(--nav-h);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 3rem;
  border-bottom: 1px solid transparent;
  transition: background .4s ease, border-color .4s ease;
}
#nav.scrolled {
  background: rgba(5,5,5,.94);
  border-color: var(--grey);
  backdrop-filter: blur(12px);
}
.nav-logo {
  display:flex; align-items:center; gap:.8rem;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.5rem; letter-spacing: .24em;
  color: var(--white); text-decoration: none;
  cursor: pointer;
}
.nav-logo-img { height:40px; width:auto; }
.nav-logo-text { display:flex; flex-direction:column; }
.nav-logo-title { font-family:'Bebas Neue',sans-serif; font-size:1.5rem; letter-spacing:.24em; color:var(--white); line-height:1; }
.nav-logo-sub { font-family:'Space Mono',monospace; font-size:.44rem; letter-spacing:.4em; color:var(--dim); margin-top:.25rem; text-transform:uppercase; }
.nav-logo sub {
  display:block; font-family:'Space Mono',monospace;
  font-size:.48rem; letter-spacing:.5em;
  color:var(--dim); margin-top:.2rem;
  text-transform:uppercase; font-style:normal;
}

/* hamburger */
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; }
.hamburger span { display:block; width:24px; height:1px; background:var(--white); transition: all .35s ease; }
.hamburger.open span:nth-child(1){ transform: translateY(6px) rotate(45deg); }
.hamburger.open span:nth-child(2){ opacity:0; }
.hamburger.open span:nth-child(3){ transform: translateY(-6px) rotate(-45deg); }

.nav-menu {
  display:flex; align-items:center; gap:2.2rem; list-style:none;
}
.nav-menu a {
  font-family:'Space Mono',monospace; font-size:.58rem;
  letter-spacing:.2em; color:var(--dim);
  text-decoration:none; text-transform:uppercase;
  transition:color .25s ease; position:relative;
}
.nav-menu a::after {
  content:''; position:absolute; bottom:-4px; left:0; right:0;
  height:1px; background:var(--accent);
  transform:scaleX(0); transform-origin:left; transition:transform .35s ease;
}
.nav-menu a:hover { color:var(--white); }
.nav-menu a:hover::after { transform:scaleX(1); }
.nav-menu a.active { color:var(--white); }
.nav-menu a.active::after { transform:scaleX(1); }

.nav-cta {
  font-family:'Space Mono',monospace; font-size:.55rem;
  letter-spacing:.2em; text-transform:uppercase;
  color:var(--black)!important; background:var(--accent);
  padding:.55em 1.2em; text-decoration:none!important;
  transition:background .25s ease!important;
}
.nav-cta:hover { background:var(--white)!important; color:var(--black)!important; }
.nav-cta::after { display:none!important; }

/* mobile menu overlay */
.mobile-menu {
  display:none; position:fixed; inset:0; z-index:490;
  background:rgba(5,5,5,.97); flex-direction:column;
  justify-content:center; align-items:center;
  gap:clamp(.8rem, 3.5vh, 2.4rem);
  overflow-y:auto; padding:calc(var(--nav-h) + 1rem) 2rem 5rem;
}
.mobile-menu.open { display:flex; }
.mobile-menu a {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(1.8rem, 8vw, 2.8rem);
  letter-spacing:.15em; color:var(--dim);
  text-decoration:none; transition:color .2s ease;
  line-height:1;
}
.mobile-menu a:hover { color:var(--white); }
.mobile-menu a:active { color:var(--accent); }

/* ── HERO ──────────────────────────────────── */
#hero {
  height:100vh; position:relative; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding: 0 3rem 4.5rem;
}
.hero-watermark { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2; opacity:.07; pointer-events:none; }
.hero-bg {
  position:absolute; inset:0;
  background: radial-gradient(ellipse 100% 80% at 65% 35%, #0e0e0e 0%, #000 100%);
}
/* animated grid lines */
.hero-grid {
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(var(--grey) 1px, transparent 1px),
    linear-gradient(90deg, var(--grey) 1px, transparent 1px);
  background-size: 80px 80px;
  opacity:.04;
  animation: gridMove 20s linear infinite;
}
@keyframes gridMove { from{background-position:0 0;} to{background-position:80px 80px;} }

.hero-content { position:relative; z-index:2; }
.hero-eyebrow {
  font-family:'Space Mono',monospace; font-size:.6rem;
  letter-spacing:.45em; color:var(--accent);
  text-transform:uppercase; margin-bottom:1.2rem;
  opacity:0; animation:fadeUp 1s ease .2s forwards;
}
.hero-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(5.5rem,15vw,14rem);
  line-height:.86; letter-spacing:.02em;
  color:var(--white);
  opacity:0; animation:fadeUp 1.2s ease .4s forwards;
}
.hero-title .osaka{
  display:block;
  margin-top:1.2rem;
  opacity:0;
  animation:fadeUp 1s ease .8s forwards;
}

.hero-title .osaka .jp{
  display:block;
  font-family:'Noto Sans JP', sans-serif;
  font-weight:300;
  font-size:clamp(.95rem,2.1vw,1.7rem);
  letter-spacing:.18em;
  color:var(--white);
  line-height:1.8;
}

.hero-title .osaka .en{
  display:block;
  margin-top:.45rem;
  font-family:'Space Mono', monospace;
  font-size:clamp(.56rem,1vw,.82rem);
  letter-spacing:.22em;
  color:var(--accent);
  text-transform:none;
  opacity:.95;
}

@media(max-width:768px){
  .hero-title .osaka .jp{
    font-size:clamp(.78rem,3.4vw,1rem);
    letter-spacing:.10em;
    line-height:1.7;
  }
  .hero-title .osaka .en{
    font-size:clamp(.5rem,2.6vw,.68rem);
    letter-spacing:.14em;
  }
}
.hero-right {
  position:absolute; bottom:4.5rem; right:3rem;
  text-align:right; z-index:2;
  opacity:0; animation:fadeUp 1s ease 1.1s forwards;
}
.hero-right p {
  font-family:'Space Mono',monospace; font-size:.58rem;
  letter-spacing:.25em; color:var(--dim); line-height:2.4;
  text-transform:uppercase;
}
.hero-right .live {
  display:inline-block; width:6px; height:6px;
  border-radius:50%; background:var(--red); margin-right:.6rem;
  animation:pulse 1.8s ease infinite;
}
@keyframes pulse { 0%,100%{opacity:1;} 50%{opacity:.2;} }

.hero-scroll {
  position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.6rem;
  z-index:2; opacity:0; animation:fadeIn 1s ease 1.8s forwards;
}
.hero-scroll span { font-family:'Space Mono',monospace; font-size:.48rem; letter-spacing:.4em; color:var(--mid); text-transform:uppercase; }
.scroll-bar { width:1px; height:42px; background:linear-gradient(to bottom,var(--mid),transparent); animation:scrollDrop 2s ease infinite; }
@keyframes scrollDrop { 0%,100%{transform:scaleY(1);opacity:.4;} 50%{transform:scaleY(1.4);opacity:.9;} }

/* ── SHARED SECTION STYLES ──────────────────── */
section { position:relative; }
.sec-header {
  padding: 5.5rem 3rem 1.8rem;
  border-top: 1px solid var(--grey);
  display:flex; justify-content:space-between; align-items:baseline;
  flex-wrap:wrap; gap:.8rem;
}
.sec-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.4rem,5.5vw,4.8rem);
  letter-spacing:.1em; color:var(--white); line-height:1;
}
.sec-label {
  font-family:'Space Mono',monospace; font-size:.58rem;
  letter-spacing:.3em; color:var(--dim); text-transform:uppercase;
}
.sec-body { padding: 0 3rem 5.5rem; }

/* ── EVENTS ─────────────────────────────────── */
.event-row {
  display:grid; grid-template-columns:7rem 1fr auto;
  align-items:center; gap:2.5rem;
  padding:2.6rem 0; border-bottom:1px solid #1a1a1a;
  position:relative; overflow:hidden;
  cursor:pointer; text-decoration:none; color:inherit;
}
.event-row::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to right,transparent,#0d0d0d,transparent);
  transform:translateX(-110%); transition:transform .55s ease;
}
.event-row:hover::before { transform:translateX(0); }

.ev-date { font-family:'Space Mono',monospace; font-size:.62rem; letter-spacing:.18em; color:var(--accent); line-height:1.6; text-transform:uppercase; }
.ev-name { font-family:'Bebas Neue',sans-serif; font-size:clamp(1.6rem,3.5vw,2.8rem); letter-spacing:.07em; color:var(--white); line-height:1; margin-bottom:.6rem; transition:color .3s ease; }
.event-row:hover .ev-name { color:var(--accent); }
.ev-meta { font-family:'Space Mono',monospace; font-size:.55rem; letter-spacing:.18em; color:var(--dim); text-transform:uppercase; line-height:2; }
.ev-tags { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.7rem; }
.ev-tag { font-family:'Space Mono',monospace; font-size:.46rem; letter-spacing:.18em; color:var(--dim); border:1px solid var(--grey); padding:.3em .9em; text-transform:uppercase; }
.ev-arrow { font-family:'Space Mono',monospace; font-size:1.1rem; color:var(--dim); opacity:0; transform:translateX(-8px); transition:all .4s ease; }
.event-row:hover .ev-arrow { opacity:1; transform:translateX(0); }

/* tickets button */
.btn {
  display:inline-block; font-family:'Space Mono',monospace;
  font-size:.55rem; letter-spacing:.2em; text-transform:uppercase;
  padding:.65em 1.6em; text-decoration:none; cursor:pointer;
  border:none; transition:all .3s ease;
}
.btn-outline { color:var(--white); border:1px solid var(--grey); background:transparent; }
.btn-outline:hover { border-color:var(--accent); color:var(--accent); }
.btn-fill { color:var(--black); background:var(--accent); }
.btn-fill:hover { background:var(--white); }
.btn-red { color:var(--white); background:var(--red); border:1px solid var(--red); }
.btn-red:hover { background:transparent; color:var(--red); }

/* ── GALLERY PAGINATION ────────────────────── */
.gallery-pagination { text-align:center; margin-top:2rem; }
.gallery-pg-btn { font-size:.5rem; padding:.6em 1.5em; margin:0 .3rem; }
.gallery-pg-info { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.2em; color:var(--dim); margin:0 .8rem; }

/* ── FORM UTILITIES ────────────────────────── */
.form-submit { margin-top:.5rem; width:100%; font-size:.6rem; padding:.9em; }
.recaptcha-wrap { margin-top:.5rem; }
.form-success { display:none; padding:3rem; border:1px solid var(--accent); text-align:center; }
.form-success-title { font-family:'Bebas Neue',sans-serif; font-size:2rem; letter-spacing:.15em; color:var(--accent); margin-bottom:1rem; }
.form-success-msg { font-family:'Space Mono',monospace; font-size:.55rem; letter-spacing:.2em; color:var(--dim); text-transform:uppercase; line-height:2; }

/* ── MAP BUTTON ────────────────────────────── */
.map-btn-wrap { margin-top:1.5rem; }
.map-btn { width:100%; text-align:center; display:block; }

/* ── ADDRESS SMALL ─────────────────────────── */
.addr-small { font-size:.65rem; color:var(--dim); }

/* ── EVENT ACTIONS ─────────────────────────── */
.ev-actions { margin-top:2.5rem; display:flex; gap:1rem; }

/* ── FLYER CARD INNER (placeholder) ────────── */
.flyer-card-inner { width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
.flyer-card-content { text-align:center; padding:1rem; }
.flyer-card-top { font-family:'Space Mono',monospace; font-size:.42rem; letter-spacing:.5em; color:var(--accent); margin-bottom:.8rem; }
.flyer-card-heading { font-family:'Bebas Neue',sans-serif; font-size:2.4rem; letter-spacing:.15em; color:var(--white); }
.flyer-card-bottom { font-family:'Space Mono',monospace; font-size:.45rem; letter-spacing:.3em; color:var(--dim); margin-top:.6rem; }

/* ── LIGHTBOX TEXT CARD ────────────────────── */
.lb-text-card { width:min(400px,90vw); height:min(600px,90vh); background:#0a0a0a; display:flex; align-items:center; justify-content:center; border:1px solid var(--grey); }

/* ── FLYER GALLERY ──────────────────────────── */
.gallery-controls {
  display:flex; gap:1rem; flex-wrap:wrap;
  padding: 0 3rem 2.5rem;
}
.filter-btn {
  font-family:'Space Mono',monospace; font-size:.52rem;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--dim); border:1px solid var(--grey);
  padding:.4em 1.1em; background:none; cursor:pointer; transition:all .25s ease;
}
.filter-btn:hover, .filter-btn.active { color:var(--white); border-color:var(--white); }

.flyer-grid {
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(240px,1fr));
  gap:2px;
  padding: 0 3rem 5.5rem;
}
.flyer-card {
  position:relative; overflow:hidden; cursor:pointer;
  aspect-ratio:2/3; background:var(--grey);
}
.flyer-card img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease, filter .4s ease; filter:grayscale(20%); }
.flyer-card:hover img { transform:scale(1.04); filter:grayscale(0%); }
.flyer-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.85) 0%, transparent 50%);
  opacity:0; transition:opacity .4s ease;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:1.2rem;
}
.flyer-card:hover .flyer-overlay { opacity:1; }
.flyer-overlay span { font-family:'Bebas Neue',sans-serif; font-size:1.2rem; letter-spacing:.1em; color:var(--white); }
.flyer-overlay small { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.2em; color:var(--dim); margin-top:.3rem; text-transform:uppercase; }

/* placeholder cards */
.flyer-placeholder {
  aspect-ratio:2/3; background:#0e0e0e;
  border:1px dashed var(--grey);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.8rem;
  cursor:pointer; transition:border-color .3s ease;
}
.flyer-placeholder:hover { border-color:var(--accent); }
.flyer-placeholder svg { opacity:.3; }
.flyer-placeholder span { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.2em; color:var(--dim); text-transform:uppercase; }

/* upload zone */
.upload-zone {
  margin:0 3rem 4rem;
  border:1px dashed var(--grey); padding:3rem 2rem;
  text-align:center; cursor:pointer; transition:all .3s ease;
  position:relative; overflow:hidden;
}
.upload-zone.dragover { border-color:var(--accent); background:rgba(196,169,122,.04); }
.upload-zone input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer; }
.upload-icon { font-size:2rem; opacity:.3; margin-bottom:1rem; }
.upload-zone p { font-family:'Space Mono',monospace; font-size:.58rem; letter-spacing:.2em; color:var(--dim); text-transform:uppercase; line-height:2; }
.upload-zone em { color:var(--accent); font-style:normal; }

/* lightbox */
#lightbox {
  display:none; position:fixed; inset:0; z-index:600;
  background:rgba(0,0,0,.95); align-items:center; justify-content:center;
}
#lightbox.open { display:flex; }
#lightbox img { max-width:90vw; max-height:90vh; object-fit:contain; }
.lb-close { position:absolute; top:2rem; right:2.5rem; font-family:'Space Mono',monospace; font-size:1.2rem; color:var(--dim); cursor:pointer; transition:color .2s ease; }
.lb-close:hover { color:var(--white); }

/* ── FOOD & DRINKS ──────────────────────────── */
.fd-intro {
  padding:0 3rem 3rem;
  font-family:'Noto Sans JP',sans-serif; font-weight:300;
  font-size:.8rem; line-height:2.4; color:var(--dim); max-width:600px;
}
.fd-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:1px; padding: 0 3rem 5.5rem;
}
.fd-card {
  padding:2.8rem 2.5rem; background:#070707;
  border:1px solid var(--grey); position:relative; overflow:hidden;
  transition:border-color .3s ease;
}
.fd-card::before {
  content:''; position:absolute; top:0; left:0;
  width:2px; height:0; background:var(--accent);
  transition:height .4s ease;
}
.fd-card:hover { border-color:#3a3a3a; }
.fd-card:hover::before { height:100%; }
.fd-cat { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.35em; color:var(--accent); text-transform:uppercase; margin-bottom:1.4rem; }
.fd-item { display:flex; justify-content:space-between; align-items:baseline; padding:.7rem 0; border-bottom:1px solid #111; }
.fd-item:last-of-type { border-bottom:none; }
.fd-item-name { font-family:'Noto Sans JP',sans-serif; font-weight:300; font-size:.75rem; color:var(--white); letter-spacing:.05em; }
.fd-item-price { font-family:'Space Mono',monospace; font-size:.6rem; color:var(--dim); }
.fd-desc { font-family:'Noto Sans JP',sans-serif; font-weight:100; font-size:.65rem; color:var(--mid); margin-top:.4rem; line-height:1.8; letter-spacing:.05em; }

/* ── RESERVATION ────────────────────────────── */
.res-layout {
  display:grid; grid-template-columns:1fr 1fr;
  gap:5rem; padding:0 3rem 5.5rem; align-items:start;
}
.res-info p {
  font-family:'Noto Sans JP',sans-serif; font-weight:300;
  font-size:.76rem; line-height:2.4; color:var(--dim);
  margin-bottom:1.5rem; letter-spacing:.05em;
}
.res-rule { width:36px; height:1px; background:var(--accent); margin-bottom:1.5rem; }
.res-hours { margin-top:2rem; }
.res-hours-row { display:flex; justify-content:space-between; padding:.9rem 0; border-bottom:1px solid #111; }
.res-hours-day { font-family:'Space Mono',monospace; font-size:.58rem; letter-spacing:.18em; color:var(--dim); text-transform:uppercase; }
.res-hours-time { font-family:'Space Mono',monospace; font-size:.58rem; letter-spacing:.12em; color:var(--white); }
.res-form { display:flex; flex-direction:column; gap:1.2rem; }
.form-group { display:flex; flex-direction:column; gap:.5rem; }
.form-label { font-family:'Space Mono',monospace; font-size:.52rem; letter-spacing:.2em; color:var(--dim); text-transform:uppercase; }
.form-input, .form-select, .form-textarea {
  background:#0a0a0a; border:1px solid var(--grey); color:var(--white);
  font-family:'Noto Sans JP',sans-serif; font-weight:300;
  font-size:.75rem; padding:.85rem 1rem; letter-spacing:.05em;
  outline:none; transition:border-color .3s ease; width:100%;
  appearance:none; -webkit-appearance:none;
}
.form-input[type="date"] { -webkit-appearance:auto; appearance:auto; color-scheme:dark; }
.form-input:focus, .form-select:focus, .form-textarea:focus { border-color:var(--accent); }
.form-textarea { resize:vertical; min-height:100px; }
.form-select { background:#0a0a0a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23888' fill='none'/%3E%3C/svg%3E") no-repeat right 1rem center; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }
.form-note { font-family:'Space Mono',monospace; font-size:.48rem; letter-spacing:.15em; color:var(--mid); line-height:1.8; text-transform:uppercase; margin-top:.2rem; }
.form-consent { display:flex; align-items:flex-start; gap:.6rem; margin-top:.3rem; }
.form-consent input[type="checkbox"] { appearance:none; -webkit-appearance:none; width:16px; height:16px; border:1px solid var(--grey); background:#0a0a0a; flex-shrink:0; margin-top:1px; cursor:pointer; position:relative; transition:border-color .3s ease; }
.form-consent input[type="checkbox"]:checked { border-color:var(--accent); background:var(--accent); }
.form-consent input[type="checkbox"]:checked::after { content:'✓'; position:absolute; top:-1px; left:2px; font-size:12px; color:#000; font-weight:bold; }
.form-consent label { font-family:'Space Mono',monospace; font-size:.46rem; letter-spacing:.12em; color:var(--dim); line-height:1.8; cursor:pointer; }
.form-consent label a { color:var(--accent); text-decoration:none; transition:color .2s; }
.form-consent label a:hover { color:var(--white); }

/* ── ABOUT ──────────────────────────────────── */
.about-layout {
  display:grid; grid-template-columns:1fr 1fr;
  gap:6rem; padding:0 3rem 5.5rem;
}
.about-statement {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.8rem,5.5vw,5rem);
  line-height:.95; letter-spacing:.04em; color:var(--white);
}
.about-statement .dim { color:var(--grey); }
.about-prose { padding-top:.5rem; }
.about-prose p {
  font-family:'Noto Sans JP',sans-serif; font-weight:300;
  font-size:.76rem; line-height:2.4; color:var(--dim); margin-bottom:1.5rem; letter-spacing:.05em;
}
.about-rule { width:36px; height:1px; background:var(--accent); margin-bottom:1.5rem; }
.about-values { margin-top:2.5rem; display:flex; flex-direction:column; gap:0; }
.value-row {
  display:flex; align-items:center; gap:1.5rem; padding:1.2rem 0;
  border-bottom:1px solid #111;
}
.value-num { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.2em; color:var(--accent); width:2rem; flex-shrink:0; }
.value-text { font-family:'Noto Sans JP',sans-serif; font-weight:300; font-size:.76rem; color:var(--dim); letter-spacing:.05em; line-height:1.8; }

/* ── COMMUNITY ──────────────────────────────── */
.community-intro { padding:0 3rem 3rem; font-family:'Noto Sans JP',sans-serif; font-weight:300; font-size:.78rem; line-height:2.4; color:var(--dim); max-width:560px; }
.community-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; padding:0 3rem 3rem;
}
.community-card {
  padding:2.5rem; background:#060606; border:1px solid var(--grey);
  transition:border-color .3s ease;
  color:inherit; display:block;
}
.community-card:hover { border-color:var(--accent); }
.cc-icon { font-size:1.4rem; margin-bottom:1.2rem; opacity:.6; }
.cc-title { font-family:'Bebas Neue',sans-serif; font-size:1.4rem; letter-spacing:.1em; color:var(--white); margin-bottom:.7rem; }
.cc-desc { font-family:'Noto Sans JP',sans-serif; font-weight:300; font-size:.7rem; line-height:2; color:var(--dim); letter-spacing:.04em; }
.cc-link { display:inline-block; margin-top:1.2rem; font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.2em; color:var(--accent); text-transform:uppercase; }
.newsletter-bar {
  margin: 0 3rem 5.5rem; border:1px solid var(--grey); padding:2.5rem;
  display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap;
}
.newsletter-bar p { font-family:'Space Mono',monospace; font-size:.6rem; letter-spacing:.2em; color:var(--dim); text-transform:uppercase; }
.newsletter-form { display:flex; gap:.8rem; flex:1; min-width:260px; }
.newsletter-form input {
  flex:1; background:transparent; border:none; border-bottom:1px solid var(--grey);
  color:var(--white); font-family:'Space Mono',monospace; font-size:.6rem; letter-spacing:.15em;
  padding:.6rem 0; outline:none; transition:border-color .3s ease;
}
.newsletter-form input:focus { border-color:var(--accent); }
.newsletter-form input::placeholder { color:var(--mid); }

/* ── MAP & ADDRESS ──────────────────────────── */
.map-layout {
  display:grid; grid-template-columns:1fr 380px;
  gap:0; padding:0 3rem 5.5rem; align-items:start;
}
.map-embed { position:relative; background:#0a0a0a; overflow:hidden; }
.map-embed iframe { display:block; width:100%; height:440px; border:none; filter:grayscale(100%) invert(90%) contrast(90%); opacity:.7; }
.map-embed::after { content:''; position:absolute; inset:0; pointer-events:none; border:1px solid var(--grey); }
.address-panel { padding:3rem; background:#060606; border:1px solid var(--grey); border-left:none; }
.address-line { display:flex; flex-direction:column; gap:.3rem; padding:1.4rem 0; border-bottom:1px solid #111; }
.address-line:first-child { padding-top:0; }
.address-line:last-child { border-bottom:none; padding-bottom:0; }
.addr-label { font-family:'Space Mono',monospace; font-size:.48rem; letter-spacing:.3em; color:var(--accent); text-transform:uppercase; }
.addr-value { font-family:'Noto Sans JP',sans-serif; font-weight:300; font-size:.76rem; color:var(--white); line-height:1.8; letter-spacing:.05em; }
.addr-sub { font-family:'Space Mono',monospace; font-size:.54rem; color:var(--dim); letter-spacing:.12em; margin-top:.2rem; }
.transport-list { display:flex; flex-direction:column; gap:.6rem; margin-top:.5rem; }
.transport-item { display:flex; align-items:center; gap:.8rem; }
.transport-icon { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.15em; color:var(--black); background:var(--dim); padding:.25em .6em; flex-shrink:0; }
.transport-text { font-family:'Noto Sans JP',sans-serif; font-weight:300; font-size:.7rem; color:var(--dim); letter-spacing:.04em; }

/* ── CONTACT ─────────────────────────────────── */
.contact-layout {
  display:grid; grid-template-columns:1fr 1fr;
  gap:5rem; padding:0 3rem 5.5rem;
}
.contact-info { display:flex; flex-direction:column; gap:2.5rem; }
.contact-block {}
.cb-label { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.3em; color:var(--accent); text-transform:uppercase; margin-bottom:.7rem; }
.cb-value { font-family:'Noto Sans JP',sans-serif; font-weight:300; font-size:.78rem; color:var(--white); line-height:1.8; letter-spacing:.05em; }
.cb-note { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.15em; color:var(--dim); margin-top:.4rem; text-transform:uppercase; }
.social-row { display:flex; flex-direction:column; gap:.8rem; margin-top:.5rem; }
.social-link {
  display:flex; align-items:center; gap:1rem;
  font-family:'Space Mono',monospace; font-size:.58rem; letter-spacing:.18em;
  color:var(--dim); text-decoration:none; text-transform:uppercase;
  transition:color .25s ease; padding:.8rem 0; border-bottom:1px solid #111;
}
.social-link:hover { color:var(--white); }
.social-link span { font-size:1rem; }

/* ── FOOTER ──────────────────────────────────── */
footer {
  border-top:1px solid var(--grey);
  padding:3.5rem 3rem 2.5rem;
}
.footer-top { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:3rem; gap:3rem; flex-wrap:wrap; }
.footer-brand { }
.footer-brand-logo { display:flex; align-items:center; gap:1rem; }
.footer-logo { font-family:'Bebas Neue',sans-serif; font-size:2rem; letter-spacing:.25em; color:var(--white); }
.footer-tagline { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.3em; color:var(--mid); margin-top:.4rem; text-transform:uppercase; }
.footer-nav { display:grid; grid-template-columns:1fr 1fr; gap:.5rem 4rem; }
.footer-nav a { font-family:'Space Mono',monospace; font-size:.54rem; letter-spacing:.18em; color:var(--dim); text-decoration:none; text-transform:uppercase; transition:color .25s ease; padding:.3rem 0; }
.footer-nav a:hover { color:var(--white); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; border-top:1px solid #1a1a1a; padding-top:2rem; }
.footer-copy { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.18em; color:#333; text-transform:uppercase; }
.footer-rules { font-family:'Space Mono',monospace; font-size:.5rem; letter-spacing:.15em; color:#2a2a2a; text-transform:uppercase; text-align:right; line-height:2; }
.footer-privacy { font-family:'Space Mono',monospace; font-size:.44rem; letter-spacing:.15em; color:#333; text-decoration:none; text-transform:uppercase; transition:color .25s ease; }
.footer-privacy:hover { color:var(--dim); }

/* ── PRIVACY PAGE ──────────────────────────── */
.privacy-content { padding:0 3rem 5.5rem; max-width:760px; }
.privacy-section { margin-bottom:2.5rem; }
.privacy-section h3 { font-family:'Bebas Neue',sans-serif; font-size:1.1rem; letter-spacing:.12em; color:var(--white); margin-bottom:.8rem; }
.privacy-section p { font-family:'Noto Sans JP',sans-serif; font-weight:300; font-size:.75rem; line-height:2.2; color:var(--dim); margin-bottom:.5rem; letter-spacing:.03em; }
.privacy-section p.en { font-size:.65rem; color:var(--mid); }
.privacy-section ul { list-style:none; padding:0; margin:.5rem 0 1rem; }
.privacy-section ul li { font-family:'Noto Sans JP',sans-serif; font-weight:300; font-size:.72rem; line-height:2.2; color:var(--dim); padding-left:1.2rem; position:relative; }
.privacy-section ul li::before { content:'·'; position:absolute; left:0; color:var(--accent); font-weight:bold; }
.privacy-date { font-family:'Space Mono',monospace; font-size:.48rem; letter-spacing:.15em; color:var(--mid); margin-top:1rem; text-transform:uppercase; }

/* ── PAGE LINKS BAR (Sticky bottom) ─────────────── */
.page-links-bar {
  position:fixed; bottom:0; left:0; right:0; z-index:400;
  background:rgba(5,5,5,.92); border-top:1px solid var(--grey);
  backdrop-filter:blur(12px);
  display:flex; overflow-x:auto; padding:0 1rem;
  scrollbar-width:none;
}
.page-links-bar::-webkit-scrollbar { display:none; }
.pl-link {
  flex-shrink:0; padding:.8rem 1.2rem;
  font-family:'Space Mono',monospace; font-size:.5rem;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--mid); text-decoration:none;
  border-right:1px solid #1a1a1a;
  transition:color .2s ease, background .2s ease;
  white-space:nowrap;
}
.pl-link:hover { color:var(--white); background:rgba(255,255,255,.03); }
.pl-link.active { color:var(--accent); }

/* ── SCROLL ANIMATIONS ──────────────────────── */
.reveal {
  opacity:0; transform:translateY(22px);
  transition:opacity .8s ease, transform .8s ease;
}
.reveal.visible { opacity:1; transform:translateY(0); }

/* ── KEYFRAMES ──────────────────────────────── */
@keyframes fadeUp { from{opacity:0;transform:translateY(22px);} to{opacity:1;transform:translateY(0);} }
@keyframes fadeIn { from{opacity:0;} to{opacity:1;} }
.about-text-large {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(3rem, 6vw, 5.5rem);
    line-height: 0.95;
    letter-spacing: 0.04em;
    color: var(--white);
  }

  .about-text-large .muted { color: var(--grey); }

/* ── RESPONSIVE ─────────────────────────────── */
@media(max-width:960px) {
  .about-layout, .res-layout, .contact-layout { grid-template-columns:1fr; gap:3rem; }
  .map-layout { grid-template-columns:1fr; }
  .address-panel { border-left:1px solid var(--grey); border-top:none; }
  .community-grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:768px) {
  #nav { padding:0 1.5rem; }
  .nav-menu { display:none; }
  .hamburger { display:flex; }
  #hero { padding:0 1.5rem 3.5rem; }
  .hero-scroll { display:none; }
  .hero-right {
    position: static;
    text-align: left;
    margin-top: 1.2rem;
  }
  .hero-title .osaka {
    font-size: clamp(.72rem, 3.5vw, 1rem);
    letter-spacing: .15em;
    word-break: break-word;
    white-space: normal;
  }
  .sec-header, .sec-body, .gallery-controls, .flyer-grid, .fd-grid,
  .res-layout, .about-layout, .community-intro, .community-grid,
  .newsletter-bar, .map-layout, .contact-layout, footer .footer-top { padding-left:1.5rem; padding-right:1.5rem; }
  .event-row { grid-template-columns:5rem 1fr; gap:1.2rem; }
  .ev-arrow { display:none; }
  .community-grid { grid-template-columns:1fr; }
  .form-grid { grid-template-columns:1fr; }
  .page-links-bar {
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
    justify-content: flex-start;
  }
  .pl-link {
    padding: .7rem .6rem;
    font-size: .42rem;
    letter-spacing: .1em;
    flex-shrink: 0;
  }
  .flyer-grid { grid-template-columns:repeat(2,1fr); padding-left:1.5rem; padding-right:1.5rem; }
  body { padding-bottom:42px; }
  .detail-hero { padding:0 1.5rem 3rem; }
  .detail-content { padding:0 1.5rem 4rem; }
  .back-link { margin:0 1.5rem; }
}

/* ── DETAIL PAGES ──────────────────────────── */
.detail-hero {
  padding: calc(var(--nav-h) + 4rem) 3rem 3rem;
  border-bottom: 1px solid var(--grey);
}
.detail-hero .sec-title { margin-bottom:.5rem; }
.detail-content {
  padding: 3rem 3rem 5.5rem;
  max-width: 960px;
}
.events-content { max-width:100%; }
.events-list { padding:0; }
.detail-content p {
  font-family:'Noto Sans JP',sans-serif; font-weight:300;
  font-size:.78rem; line-height:2.4; color:var(--dim);
  margin-bottom:1.5rem; letter-spacing:.05em;
}
.back-link {
  display:inline-block; margin:2rem 3rem;
  font-family:'Space Mono',monospace; font-size:.55rem;
  letter-spacing:.2em; color:var(--dim); text-decoration:none;
  text-transform:uppercase; transition:color .25s ease;
}
.back-link:hover { color:var(--accent); }
