/* =========================================================
   FRAT v2 Main CSS — Pattern E 継承
   ========================================================= */

/* ---------- Tokens ---------- */
:root{
  --bg: #FFFFFF;
  --ink: #1A1A1A;
  --ink-soft: #6B6B6B;
  --ink-faint: #8A9A9A;
  --line: #E8E8E8;
  --line-soft: #F1F1F1;
  --accent: #1A5B93;
  --inkblack: #0A0A0A;
  --gold: #C8A658;
  --mute: #CFCFCF;

  --ff-en: 'Inter', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --ff-jp: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', sans-serif;

  --container: 1240px;
  --gutter: 48px;

  --s-xs: 8px;
  --s-sm: 16px;
  --s-md: 32px;
  --s-lg: 64px;
  --s-xl: 96px;
  --s-2xl: 160px;
  --s-3xl: 200px;

  --dur: .5s;
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--ff-jp);
  font-weight:300;
  font-size:15px;
  line-height:1.9;
  letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
hr{ border:0; border-top:1px solid var(--line); margin:0; }

::selection{ background:var(--ink); color:var(--bg); }

/* ---------- Typography ---------- */
.en{ font-family:var(--ff-en); }
.jp{ font-family:var(--ff-jp); }
.eyebrow{
  font-family:var(--ff-en);
  font-weight:400;
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
}
.num{
  font-family:var(--ff-en);
  font-weight:300;
  letter-spacing:.04em;
  font-variant-numeric: tabular-nums;
}
h1,h2,h3,h4{ margin:0; font-weight:400; letter-spacing:.01em; }
p{ margin:0; }

/* ---------- Layout ---------- */
.container{
  max-width:var(--container);
  margin:0 auto;
  padding:0 var(--gutter);
}
.section{ padding: var(--s-3xl) 0; }
.section--tight{ padding: var(--s-xl) 0; }
/* 連続する section の間を詰める (前のセクション直下にくっつけたい時) */
.section--follow{ padding-top: 0; }
/* single-hero 直後の section--tight は上 padding を 0 にして連続読ませる */
.single-hero + .section--tight{ padding-top: 0; }
.rule{ height:1px; background:var(--line); width:100%; }

/* =========================================================
   HEADER
   ========================================================= */
.site-header{
  position:fixed;
  top:0; left:0; right:0;
  background:rgba(255,255,255,.0);
  backdrop-filter:saturate(160%) blur(0px);
  -webkit-backdrop-filter:saturate(160%) blur(0px);
  border-bottom:1px solid transparent;
  z-index:100;
  transition:background .4s var(--ease), border-color .4s var(--ease), backdrop-filter .4s var(--ease);
}
.site-header.is-stuck{
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(160%) blur(8px);
  -webkit-backdrop-filter:saturate(160%) blur(8px);
  border-bottom-color:var(--line);
}
.site-header__inner{
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  height:72px;
  padding:0 var(--gutter);
  max-width:var(--container);
  margin:0 auto;
}
.brand{
  display:inline-flex;
  align-items:center;
  line-height:1;
  color:var(--ink);
  text-decoration:none;
}
.brand__img{
  height:28px;
  width:auto;
  display:block;
}
.nav{
  display:flex;
  gap:40px;
  justify-content:center;
  list-style:none;
  padding:0;
  margin:0;
}
.nav a{
  font-family:var(--ff-en);
  font-size:12px;
  font-weight:400;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink);
  padding:4px 0;
  position:relative;
  transition:color .25s var(--ease);
}
.nav a::after{
  content:"";
  position:absolute;
  left:50%; right:50%;
  bottom:-2px;
  height:1px;
  background:var(--ink);
  transition:left .3s var(--ease), right .3s var(--ease);
}
.nav a:hover::after,
.nav .current-menu-item a::after,
.nav .current_page_item a::after{ left:0; right:0; }

.header__right{
  justify-self:end;
  display:flex;
  align-items:center;
  gap:18px;
}
.lang{
  display:flex;
  gap:10px;
  align-items:center;
  font-family:var(--ff-en);
  font-size:12px;
  font-weight:400;
  letter-spacing:.18em;
  color:var(--ink-soft);
}
.lang button,
.lang a{ padding:4px 2px; color:var(--ink-soft); letter-spacing:.18em; }
.lang .is-active{ color:var(--ink); }
.lang span{ color:var(--line); }

/* mobile menu toggle */
.menu-toggle{
  display:none;
  width:32px;
  height:32px;
  padding:0;
  position:relative;
  z-index:110;
}
.menu-toggle__bar{
  display:block;
  width:22px;
  height:1px;
  background:var(--ink);
  margin:5px auto;
  transition:transform .3s var(--ease), opacity .3s var(--ease);
}
body.is-menu-open .menu-toggle__bar:nth-child(1){ transform:translateY(6px) rotate(45deg); }
body.is-menu-open .menu-toggle__bar:nth-child(2){ opacity:0; }
body.is-menu-open .menu-toggle__bar:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* モバイルメニューオーバーレイ */
.mobile-menu{
  position:fixed;
  top:0; left:0; right:0; bottom:0;
  background:#fff;
  z-index:99;
  opacity:0;
  pointer-events:none;
  transition:opacity .3s var(--ease);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  padding: 96px var(--gutter) 48px;
}
body.is-menu-open .mobile-menu{
  opacity:1;
  pointer-events:auto;
}
.mobile-menu ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:28px;
  text-align:center;
}
.mobile-menu a{
  font-family:var(--ff-en);
  font-size:20px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink);
}

/* =========================================================
   HERO — impact
   ========================================================= */
.hero{
  position:relative;
  min-height:100vh;
  background:#FFFFFF;
  overflow:hidden;
  isolation:isolate;
}
.hero__washi{
  position:absolute; inset:0;
  background-image:
    radial-gradient(ellipse at 20% 30%, rgba(0,0,0,.025), transparent 55%),
    radial-gradient(ellipse at 80% 70%, rgba(0,0,0,.02), transparent 60%),
    repeating-linear-gradient(
      0deg,
      rgba(0,0,0,.012) 0 1px,
      transparent 1px 3px
    );
  opacity:0;
  transition:opacity 2.4s var(--ease) .8s;
  pointer-events:none;
  z-index:0;
}
.hero.is-ready .hero__washi{ opacity:1; }

.hero__strip{
  position:relative;
  z-index:3;
  padding-top:120px;
  padding-left:var(--gutter);
  padding-right:var(--gutter);
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:var(--ink-soft);
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
}
.hero__strip .dot{
  display:inline-block; width:4px; height:4px; border-radius:50%;
  background:var(--accent); margin:0 10px;
  vertical-align:middle; transform:translateY(-2px);
}

.hero__stage{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns: 1.35fr 1fr;
  align-items:center;
  gap:var(--s-xl);
  height:calc(100vh - 220px);
  min-height:520px;
  max-width:1440px;
  margin:0 auto;
  padding:var(--s-lg) var(--gutter) 0;
}

.hero__number{
  position:relative;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
.hero__number svg{
  width:100%;
  height:80vh;
  max-height:720px;
  display:block;
  overflow:visible;
}
.hero__number text{
  font-family: 'Helvetica Neue', Helvetica, Arial, 'Inter', 'Noto Sans JP', sans-serif;
  font-weight: 500;
  letter-spacing: -0.02em;
}
.hero__number .n-path{
  fill:none;
  stroke:#B8B8B8;
  stroke-width:1;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray: 3800;
  stroke-dashoffset: 3800;
  animation: drawNine 2.2s cubic-bezier(.6,.02,.2,1) .35s forwards;
}
.hero__number .n-fill{
  fill:#B8B8B8;
  opacity:0;
  animation: fillNine .9s var(--ease) 2.4s forwards;
}
.hero__number .n-shadow{
  fill:none;
  stroke:#E5E5E5;
  stroke-width:1;
  opacity:0;
  transform: translate(10px, 10px);
  animation: shadowNine 1s var(--ease) 2.6s forwards;
}
@keyframes drawNine{ to{ stroke-dashoffset: 0; } }
@keyframes fillNine{ to{ opacity:1; } }
@keyframes shadowNine{ to{ opacity:.0; } }

.hero__counter{
  position:absolute;
  left:0; top:18%;
  font-family:var(--ff-en);
  font-weight:300;
  font-size:12px;
  letter-spacing:.34em;
  color:var(--ink-soft);
  text-transform:uppercase;
  pointer-events:none;
}
.hero__counter b{
  display:inline-block;
  min-width:2.2em;
  text-align:left;
  color:var(--ink);
  font-weight:400;
  font-variant-numeric: tabular-nums;
}

.hero__pen{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  height:100%;
  opacity:0;
  animation: fadeMeta 1.2s var(--ease) 1.6s forwards;
}
@keyframes fadeMeta{ to{ opacity:1; } }
.hero__meta{
  display:flex;
  flex-direction:column;
  gap:18px;
  max-width:100%;
}
.hero__meta .tl-en{
  font-family:'Inter','Noto Sans JP',sans-serif;
  font-weight:500;
  font-size:clamp(20px, 2.4vw, 30px);
  letter-spacing:0.02em;
  line-height:1.4;
  color:var(--ink);
}
.hero__meta .tl-en em{
  font-style:normal;
  color:var(--accent);
  margin:0 .35em;
}
.hero__meta .tl-jp{
  font-family:'Noto Sans JP',sans-serif;
  font-weight:300;
  font-size:clamp(13px, 1.2vw, 16px);
  letter-spacing:0.08em;
  color:var(--ink-faint);
  line-height:1.7;
}
.hero__meta .tl-jp .sep{
  display:inline-block;
  width:6px; height:6px;
  margin:0 .8em;
  background:var(--accent);
  border-radius:50%;
  vertical-align:middle;
}

.hero__foot{
  position:absolute;
  left:0; right:0; bottom:0;
  z-index:3;
  padding: 0 var(--gutter) 72px;
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  align-items:end;
  gap: var(--s-lg);
}
.hero__tagline{
  grid-column: 2;
  text-align:center;
  opacity:0;
  transform: translateY(8px);
  animation: fadeUp .9s var(--ease) 3.2s forwards;
}
.hero__tagline .tl-en{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:15px;
  letter-spacing:.5em;
  text-transform:uppercase;
  color:var(--ink);
  margin-bottom:14px;
}
.hero__tagline .tl-en em{
  font-style:italic;
  font-weight:300;
  color:var(--accent);
  letter-spacing:.1em;
  margin:0 .4em;
}
.hero__tagline .tl-jp{
  font-family:var(--ff-jp);
  font-weight:300;
  font-size:12px;
  letter-spacing:.34em;
  color:var(--ink-soft);
}
.hero__tagline .tl-jp .sep{
  display:inline-block;
  width:1px; height:10px;
  background:var(--line);
  margin:0 14px;
  vertical-align:middle;
}
@keyframes fadeUp{ to{ opacity:1; transform:translateY(0); } }

.hero__scroll{
  position:absolute;
  left: 28px;
  bottom: 72px;
  z-index:3;
  writing-mode: vertical-rl;
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.44em;
  text-transform:uppercase;
  color:var(--ink-faint);
  display:flex;
  align-items:center;
  gap:14px;
  opacity:0;
  animation: fadeUp .8s var(--ease) 3.6s forwards;
}
.hero__scroll::after{
  content:"";
  display:block;
  width:1px; height:48px;
  background:linear-gradient(to bottom, var(--ink-faint), transparent);
  animation: scrollline 2.4s var(--ease) 4.2s infinite;
}
@keyframes scrollline{
  0%{ transform:scaleY(0); transform-origin:top; }
  50%{ transform:scaleY(1); transform-origin:top; }
  51%{ transform:scaleY(1); transform-origin:bottom; }
  100%{ transform:scaleY(0); transform-origin:bottom; }
}

.hero__dateline{
  position:absolute;
  right: 28px;
  bottom: 72px;
  z-index:3;
  writing-mode: vertical-rl;
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.38em;
  text-transform:uppercase;
  color:var(--ink-faint);
  opacity:0;
  animation: fadeUp .8s var(--ease) 3.8s forwards;
}

.ink-trail{
  position:fixed;
  top:0; left:0;
  width:10px; height:10px;
  border-radius:50%;
  background: radial-gradient(circle at 40% 40%, rgba(10,10,10,.55), rgba(10,10,10,0) 70%);
  pointer-events:none;
  mix-blend-mode: multiply;
  z-index: 60;
  transform: translate(-50%,-50%);
  opacity: 0;
  transition: opacity .4s var(--ease);
}
.ink-trail.is-on{ opacity: .9; }

/* =========================================================
   SECTION HEAD
   ========================================================= */
.sec-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom: var(--s-xl);
  gap: var(--s-lg);
  flex-wrap:wrap;
}
.sec-head__title{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:clamp(32px, 4vw, 52px);
  line-height:1.1;
  letter-spacing:-.01em;
}
.sec-head__title small{
  display:block;
  font-family:var(--ff-jp);
  font-weight:300;
  font-size:13px;
  letter-spacing:.24em;
  color:var(--ink-soft);
  margin-top:14px;
}
.sec-head__meta{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
  text-align:right;
  max-width:360px;
}

/* =========================================================
   3-PILLARS
   ========================================================= */
.pillars{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
/* 4 items: 2x2 grid (About ページの「4つの場」向け) */
.pillars--quad{
  grid-template-columns: repeat(2, 1fr);
}
.pillars--quad .pillar:nth-child(2n){ border-right:0; }
.pillars--quad .pillar:nth-child(-n+2){ border-bottom:1px solid var(--line); }
.pillar{
  padding: var(--s-xl) var(--s-lg);
  border-right:1px solid var(--line);
  position:relative;
  display:flex;
  flex-direction:column;
  gap: var(--s-md);
  min-height: 360px;
  transition: background .5s var(--ease);
}
.pillar:last-child{ border-right:0; }
.pillar:hover{ background: var(--line-soft); }
.pillar__n{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:12px;
  color:var(--ink-faint);
  letter-spacing:.24em;
}
.pillar__t{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:40px;
  letter-spacing:.02em;
  line-height:1;
  display:flex;
  align-items:center;
  gap:14px;
}
.pillar__t .badge{
  display:inline-block;
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.18em;
  color:#fff;
  background:var(--accent);
  padding:4px 10px;
  border-radius:999px;
  vertical-align:middle;
  transform:translateY(-8px);
}
.pillar__jp{
  font-family:var(--ff-jp);
  font-size:13px;
  color:var(--ink-soft);
  letter-spacing:.2em;
}
.pillar__p{
  font-family:var(--ff-jp);
  font-size:14px;
  color:var(--ink);
  line-height:2.0;
  margin-top:var(--s-sm);
}
.pillar__more{
  margin-top:auto;
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink);
  display:inline-flex; align-items:center; gap:10px;
}
.pillar__more::after{
  content:"";
  width:28px; height:1px; background:var(--ink);
  transition: width .3s var(--ease);
}
.pillar:hover .pillar__more::after{ width:56px; }

/* =========================================================
   NEXT / EVENT HERO
   ========================================================= */
.next{
  display:grid;
  grid-template-columns: 1.6fr 1fr;
  gap: var(--s-xl);
  align-items:stretch;
}
.next__photo{
  position:relative;
  aspect-ratio: 4 / 3;
  overflow:hidden;
  background:var(--line-soft);
}
.next__photo img{
  width:100%; height:100%; object-fit:cover;
  filter:grayscale(.08) contrast(1.02);
  transform:scale(1.02);
  transition: transform 1.2s var(--ease);
}
.next__photo:hover img{ transform:scale(1); }
.next__photo .caption{
  position:absolute;
  left:16px; bottom:16px;
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.24em;
  color:#fff;
  background:rgba(0,0,0,.35);
  padding:6px 10px;
  backdrop-filter: blur(4px);
}
.next__side{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding: var(--s-md) 0;
  border-left:1px solid var(--line);
  padding-left: var(--s-lg);
}
.next__kicker{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:72px;
  letter-spacing:-.02em;
  line-height:1;
}
.next__kicker small{
  display:block;
  font-family:var(--ff-jp);
  font-size:13px;
  letter-spacing:.24em;
  color:var(--ink-soft);
  margin-top:16px;
}
.next__facts{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--s-md) var(--s-md);
  margin-top: var(--s-lg);
}
.fact{
  display:flex;
  flex-direction:column;
  gap:6px;
  border-top:1px solid var(--line);
  padding-top: 14px;
}
.fact__k{
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
}
.fact__v{
  font-family:var(--ff-jp);
  font-size:14px;
  color:var(--ink);
  letter-spacing:.08em;
}
.fact__v .num{ font-family:var(--ff-en); font-size:18px; font-weight:400; margin-right:6px; }

/* =========================================================
   BOOSTER
   ========================================================= */
.booster{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--s-lg);
}
.b-card{
  display:flex;
  flex-direction:column;
  gap: var(--s-sm);
  position:relative;
  padding-top: var(--s-md);
  border-top:1px solid var(--line);
}
.b-card__badge{
  position:absolute;
  top: -18px; right: 0;
  width: 44px; height: 44px;
  border-radius:50%;
  background:var(--bg);
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--ff-en);
  font-size:9px;
  letter-spacing:.18em;
  color:var(--ink-soft);
  text-transform:uppercase;
}
.b-card__badge--live{ border-color:var(--accent); color:var(--accent); }
.b-card__badge--soon{ border-color:var(--ink-soft); color:var(--ink-soft); }
.b-card__badge--sold{ background:var(--ink); border-color:var(--ink); color:#fff; }
.b-card__photo{
  aspect-ratio: 5 / 6;
  overflow:hidden;
  background:var(--line-soft);
}
.b-card__photo img{
  width:100%; height:100%; object-fit:cover;
  filter: grayscale(.1);
  transform: scale(1.02);
  transition: transform 1s var(--ease), filter .6s var(--ease);
}
.b-card:hover .b-card__photo img{ transform:scale(1); filter:grayscale(0); }
.b-card__brand{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-top: var(--s-sm);
}
.b-card__name{
  font-family:var(--ff-en);
  font-weight:400;
  font-size:20px;
  letter-spacing:.01em;
}
.b-card__name small{
  display:block;
  font-family:var(--ff-jp);
  font-size:12px;
  color:var(--ink-soft);
  margin-top:4px;
  letter-spacing:.12em;
}
.b-card__price{
  font-family:var(--ff-en);
  font-size:14px;
  font-weight:400;
  color:var(--ink);
  letter-spacing:.04em;
  display:flex; align-items:baseline; gap:10px;
}
.b-card__price em{
  font-style:normal;
  font-size:11px;
  color:var(--ink-faint);
  letter-spacing:.2em;
}

.booster-empty{
  text-align:center;
  padding: var(--s-xl) var(--s-md);
  border:1px solid var(--line);
  color:var(--ink-soft);
  font-family:var(--ff-jp);
  font-size:14px;
  letter-spacing:.12em;
}

/* =========================================================
   PRESS
   ========================================================= */
.press{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--s-lg);
}
.article{
  display:flex;
  flex-direction:column;
  gap: var(--s-sm);
  border-top:1px solid var(--line);
  padding-top: var(--s-md);
}
.article__meta{
  display:flex;
  gap: var(--s-sm);
  align-items:center;
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
}
.article__meta .tag{ color:var(--accent); }
.article__photo{
  aspect-ratio: 16 / 9;
  overflow:hidden;
  background:var(--line-soft);
  border:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:center;
}
.article__photo img{
  width:100%; height:100%;
  /* ロゴやPNG素材が多いため contain で余白を保って表示 */
  object-fit:contain;
  padding: 8%;
  filter:grayscale(.08);
  transition: transform .6s var(--ease), filter .6s var(--ease);
}
.article:hover .article__photo img{ transform:scale(1.03); filter:none; }
.article__title{
  font-family:var(--ff-jp);
  font-size:18px;
  font-weight:400;
  line-height:1.7;
  color:var(--ink);
}
.article__dek{
  font-size:13px;
  color:var(--ink-soft);
  line-height:1.9;
}
.article__read{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.24em;
  color:var(--ink);
  margin-top: auto;
  display:inline-flex; gap:10px; align-items:center;
  text-transform:uppercase;
}
.article__read::after{
  content:""; width:28px; height:1px; background:var(--ink);
  transition: width .3s var(--ease);
}
.article:hover .article__read::after{ width:56px; }

/* =========================================================
   RELATED ARCHIVE (FRATBOX 等の号付帯企画)
   ========================================================= */
.related-archive__content{
  max-width: 800px;
  margin: 0 auto;
  font-family: var(--ff-jp);
  font-size: 14px;
  line-height: 2;
  color: var(--ink);
}
.related-archive__content h3{
  font-family: var(--ff-en);
  font-weight: 300;
  font-size: 28px;
  letter-spacing: .02em;
  margin-top: var(--s-xl);
  margin-bottom: var(--s-sm);
}
.related-archive__content h4{
  font-family: var(--ff-jp);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .08em;
  margin-top: var(--s-lg);
  margin-bottom: var(--s-sm);
}
.related-archive__content p{ margin: 0 0 var(--s-md); }
.related-archive__content blockquote{
  margin: var(--s-md) 0;
  padding: var(--s-sm) var(--s-md);
  border-left: 2px solid var(--accent);
  color: var(--ink-soft);
  font-style: italic;
}
.related-archive__content ol{ padding-left: 1.4em; }
.related-archive__content ol li{ margin-bottom: 6px; }
.related-archive__content img{ max-width: 100%; height: auto; display: block; }
.related-archive__figures{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--s-md);
  margin: var(--s-lg) 0;
}
.related-archive__figures figure{ margin: 0; }
.related-archive__figures figcaption{
  margin-top: 8px;
  font-family: var(--ff-en);
  font-size: 10px;
  letter-spacing: .2em;
  color: var(--ink-soft);
  text-transform: uppercase;
}
.related-archive__meta{
  font-family: var(--ff-en);
  font-size: 12px;
  letter-spacing: .18em;
  color: var(--ink-soft);
  margin-bottom: var(--s-sm);
}
@media (max-width: 720px){
  .related-archive__figures{ grid-template-columns: 1fr; }
}

/* =========================================================
   TIMELINE / ARCHIVE
   ========================================================= */
.timeline{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:0;
}
.tl-col{
  padding: var(--s-xl) var(--s-lg);
  border-left:1px solid var(--line);
}
.tl-col:first-child{ border-left:0; padding-left:0; }
.tl-col__head{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  margin-bottom: var(--s-lg);
}
.tl-col__head h3{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:28px;
  letter-spacing:.02em;
}
.tl-col__head small{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.24em;
  color:var(--ink-soft);
  text-transform:uppercase;
}
.tl-list{ list-style:none; padding:0; margin:0; }
.tl-list li{
  display:grid;
  grid-template-columns: 64px 1fr auto;
  gap: var(--s-md);
  align-items:baseline;
  padding: 14px 0;
  border-top: 1px solid var(--line);
  font-family:var(--ff-jp);
  font-size:13px;
}
.tl-list li:last-child{ border-bottom:1px solid var(--line); }
.tl-list .n{
  font-family:var(--ff-en);
  font-weight:400;
  font-size:13px;
  color:var(--ink);
  letter-spacing:.04em;
}
.tl-list .t{ color:var(--ink); }
.tl-list .t small{
  display:block;
  font-size:11px;
  color:var(--ink-soft);
  letter-spacing:.18em;
  margin-top:2px;
}
.tl-list .d{
  font-family:var(--ff-en);
  font-size:11px;
  color:var(--ink-soft);
  letter-spacing:.12em;
  white-space:nowrap;
}

/* =========================================================
   ABOUT
   ========================================================= */
.about__lead{
  max-width: 760px;
  font-family:var(--ff-jp);
  font-size:16px;
  line-height:2.2;
  color:var(--ink);
  margin-bottom: var(--s-xl);
}
.about__stats{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  margin: var(--s-xl) 0;
}
.about__stat{
  padding: var(--s-lg) var(--s-md);
  border-right:1px solid var(--line);
  text-align:center;
}
.about__stat:last-child{ border-right:0; }
.about__stat .k{
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-bottom:8px;
}
.about__stat .v{
  font-family:var(--ff-en);
  font-size:36px;
  font-weight:300;
  letter-spacing:-.01em;
  color:var(--ink);
}
.about__stat .u{
  font-family:var(--ff-jp);
  font-size:11px;
  color:var(--ink-soft);
  letter-spacing:.18em;
  margin-top:4px;
}

.about__corp{
  margin-top: var(--s-xl);
  padding: var(--s-lg) 0;
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns: 200px 1fr;
  gap: var(--s-md);
  font-family:var(--ff-jp);
  font-size:14px;
  line-height:2;
}
.about__corp dt{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
}
.about__corp dd{ margin:0; color:var(--ink); }

/* =========================================================
   CTA
   ========================================================= */
.cta{ text-align:center; }
.cta__pre{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-bottom: var(--s-md);
}
.cta__title{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:clamp(36px, 5vw, 72px);
  letter-spacing:-.01em;
  line-height:1.1;
}
.cta__title small{
  display:block;
  font-family:var(--ff-jp);
  font-size:14px;
  letter-spacing:.24em;
  color:var(--ink-soft);
  margin-top: var(--s-md);
}
.cta__btns{
  display:flex;
  gap: var(--s-md);
  justify-content:center;
  margin-top: var(--s-xl);
  flex-wrap:wrap;
}
.btn{
  display:inline-flex;
  align-items:center;
  gap: 14px;
  padding: 18px 42px;
  font-family:var(--ff-en);
  font-size:12px;
  letter-spacing:.24em;
  text-transform:uppercase;
  border:1px solid var(--ink);
  color:var(--ink);
  background: transparent;
  transition: color .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease);
}
.btn:hover{ background:var(--ink); color:var(--bg); }
.btn--accent{ border-color:var(--accent); color:#fff; background:var(--accent); }
.btn--accent:hover{ background:#134570; border-color:#134570; color:#fff; }
.btn__arrow{
  width:18px; height:1px; background:currentColor; position:relative;
}
.btn__arrow::after{
  content:""; position:absolute; right:-1px; top:-4px;
  width:8px; height:8px;
  border-top:1px solid currentColor;
  border-right:1px solid currentColor;
  transform: rotate(45deg);
}
.cta__link{
  margin-top: var(--s-lg);
  font-family:var(--ff-en);
  font-size:12px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
  display:inline-block;
  border-bottom:1px solid var(--line);
  padding-bottom:6px;
}
.cta__link:hover{ color:var(--ink); border-bottom-color:var(--ink); }

/* =========================================================
   TSW BANNER
   ========================================================= */
.tsw-banner{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding: var(--s-lg) 0;
  background:#FAFAFA;
}
.tsw-banner__inner{
  display:grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--s-md);
  align-items:center;
}
.tsw-banner__label{
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--ink-soft);
}
.tsw-banner__title{
  font-family:var(--ff-en);
  font-weight:400;
  font-size:clamp(18px, 2.4vw, 28px);
  letter-spacing:.04em;
  color:var(--ink);
}
.tsw-banner__title small{
  display:block;
  font-family:var(--ff-jp);
  font-size:12px;
  font-weight:300;
  letter-spacing:.18em;
  color:var(--ink-soft);
  margin-top:4px;
}
.tsw-banner__link{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink);
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.tsw-banner__link::after{
  content:"↗";
  font-size:14px;
}

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{
  border-top:1px solid var(--line);
  padding: var(--s-xl) 0 var(--s-lg);
  font-size:13px;
  color:var(--ink-soft);
}
.footer__grid{
  display:grid;
  grid-template-columns: 1.6fr 1fr;
  gap: var(--s-xl);
  margin-bottom: var(--s-lg);
}
.footer__col--nav{
  display:flex;
  align-items:flex-end;   /* Brand 列の高さに合わせて下揃え */
  justify-content:flex-end;
}
.footer__col--nav ul{
  text-align:right;
}
.footer__brand{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:18px;
  letter-spacing:.34em;
  color:var(--ink);
}
.footer__note{
  margin-top: var(--s-sm);
  font-family:var(--ff-jp);
  font-size:12px;
  color:var(--ink-soft);
  line-height:2;
  max-width: 320px;
}
.footer__col h5{
  font-family:var(--ff-en);
  font-weight:400;
  font-size:11px;
  letter-spacing:.24em;
  color:var(--ink-soft);
  text-transform:uppercase;
  margin-bottom: var(--s-sm);
}
.footer__col ul{
  list-style:none; padding:0; margin:0;
  display:flex; flex-direction:column; gap:10px;
}
.footer__col a{
  font-family:var(--ff-jp);
  font-size:13px;
  color:var(--ink);
  letter-spacing:.08em;
}
.footer__col a:hover{ color:var(--accent); }
.footer__sns{
  display:flex;
  gap:16px;
  margin-top: var(--s-sm);
}
.footer__sns a{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink);
}
.footer__bottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-top: var(--s-md);
  border-top:1px solid var(--line);
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-faint);
  flex-wrap:wrap;
  gap: var(--s-sm);
}

/* =========================================================
   PAGE HEADER (archive / subpage)
   ========================================================= */
.page-head{
  padding: 180px 0 var(--s-xl);
  border-bottom:1px solid var(--line);
}
.page-head__inner{
  max-width: var(--container);
  margin:0 auto;
  padding:0 var(--gutter);
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  flex-wrap:wrap;
  gap: var(--s-md);
}
.page-head__title{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:clamp(40px, 6vw, 80px);
  line-height:1;
  letter-spacing:-.02em;
}
.page-head__title small{
  display:block;
  font-family:var(--ff-jp);
  font-size:13px;
  letter-spacing:.24em;
  color:var(--ink-soft);
  margin-top:18px;
}
.page-head__meta{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
  text-align:right;
}

/* =========================================================
   FILTER BAR
   ========================================================= */
.filter-bar{
  display:flex;
  gap:var(--s-md);
  align-items:center;
  flex-wrap:wrap;
  padding: var(--s-md) 0;
  border-bottom:1px solid var(--line);
  margin-bottom: var(--s-lg);
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.filter-bar__label{ color:var(--ink-soft); }
.filter-bar a{
  color:var(--ink-soft);
  padding:6px 4px;
  border-bottom:1px solid transparent;
}
.filter-bar a:hover,
.filter-bar a.is-active{
  color:var(--ink);
  border-bottom-color:var(--ink);
}

/* =========================================================
   EXHIBITOR GRID (LOGOS)
   ========================================================= */
.exhibitor-grid{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  background: transparent;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
.exhibitor-cell{
  background:#fff;
  min-height: 132px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding: var(--s-sm);
  min-width: 0;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  transition: background .3s var(--ease);
}
.exhibitor-cell:hover{ background: var(--line-soft); }
.exhibitor-cell img{
  max-width: 70%;
  max-height: 54px;
  object-fit:contain;
  filter: grayscale(1);
  transition: filter .3s var(--ease);
}
.exhibitor-cell:hover img{ filter: grayscale(0); }
.exhibitor-cell__name{
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink-soft);
  text-align:center;
  /* 2行まで表示して ... で切る (長い名前の高さ崩れ防止) */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
  max-width: 100%;
}

/* =========================================================
   EDITION GRID (/events/) */
.edition-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s-md);
}
.edition-card{
  display:block;
  color: var(--ink);
  text-decoration:none;
  border: 1px solid var(--line);
  background:#fff;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.edition-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}
.edition-card.is-next{ border-color: var(--ink); }
.edition-card__visual{
  aspect-ratio: 3 / 2;
  background: var(--line-soft);
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.edition-card__visual img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.edition-card__visual--placeholder span{
  font-family:var(--ff-en);
  font-size:24px;
  letter-spacing:.18em;
  color:var(--ink-soft);
}
.edition-card__body{
  padding: var(--s-md);
}
.edition-card__kicker{
  display:inline-block;
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:#fff;
  background: var(--ink);
  padding: 2px 8px;
  margin-bottom: var(--s-xs);
}
.edition-card__title{
  font-size: 22px;
  letter-spacing: .02em;
  margin: 0 0 4px;
}
.edition-card__theme{
  font-family: var(--ff-en);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin: 0 0 var(--s-sm);
}
.edition-card__meta{
  display:grid;
  grid-template-columns: 80px 1fr;
  gap: 4px 12px;
  font-size: 12px;
  margin:0;
}
.edition-card__meta dt{
  font-family:var(--ff-en);
  font-size: 10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-soft);
  padding-top:2px;
}
.edition-card__meta dd{
  margin:0;
  color:var(--ink);
}
@media (max-width: 960px){
  .edition-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px){
  .edition-grid{ grid-template-columns: 1fr; }
}

/* ============================================================
   Exhibitor layout variants (?design=A|B|C)
   ============================================================ */

/* design=B: ヒーロー右端にロゴ。右列幅をサイドバーと同じ 320px に保ち、
   その中でロゴを左寄せして 240x240 にすると、サイドバー左端と揃う */
.single-hero--exhibitor.design-B .single-hero__inner{
  display: grid;
  grid-template-columns: 1fr 320px;
  align-items: center;
  gap: var(--s-xl);
}
.single-hero--exhibitor.design-B .single-hero__logo{
  width: 240px;
  height: 240px;
  margin: 0;
  justify-self: start;
  border: 1px solid var(--line);
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--s-md);
  box-sizing: border-box;
}
.single-hero--exhibitor.design-B .single-hero__logo img{
  max-width: 100%;
  max-height: 100%;
  display: block;
}
@media (max-width: 1100px){
  .single-hero--exhibitor.design-B .single-hero__inner{
    grid-template-columns: 1fr 240px;
  }
  .single-hero--exhibitor.design-B .single-hero__logo{ width: 200px; height: 200px; }
}
@media (max-width: 720px){
  .single-hero--exhibitor.design-B .single-hero__inner{
    grid-template-columns: 1fr;
  }
  .single-hero--exhibitor.design-B .single-hero__logo{ width: 180px; height: 180px; justify-self: start; }
}

/* design=A: サイドバー最上部にロゴ */
.side-logo{
  margin: 0 0 var(--s-md);
  aspect-ratio: 1 / 1;
  border: 1px solid var(--line);
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  box-sizing: border-box;
  width: 120px;
}
.side-logo img{ max-width: 100%; max-height: 100%; display: block; }

/* design=C: メイン上部にロゴ+名前カード */
.exhibitor-card{
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: var(--s-md);
  align-items: center;
  margin-bottom: var(--s-lg);
  padding: var(--s-md);
  border: 1px solid var(--line);
  background: #fff;
}
.exhibitor-card__logo{
  margin: 0;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  background: var(--line-soft);
  box-sizing: border-box;
}
.exhibitor-card__logo img{ max-width: 100%; max-height: 100%; display: block; }
.exhibitor-card__name-ja{
  font-family: var(--ff-jp);
  font-size: 22px;
  font-weight: 400;
  margin: 0 0 4px;
}
.exhibitor-card__name-en{
  font-family: var(--ff-en);
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin: 0;
}
@media (max-width: 560px){
  .exhibitor-card{ grid-template-columns: 100px 1fr; }
}

/* Exhibitor: CATALOG / MASTER ボタン */
.exhibitor-cta{
  display: flex;
  gap: var(--s-sm);
  margin: var(--s-lg) 0 0;
  flex-wrap: wrap;
}
.btn-outline{
  display: inline-block;
  padding: 12px 28px;
  border: 1px solid var(--ink);
  font-family: var(--ff-en);
  font-size: 12px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
  background: #fff;
  transition: background .2s var(--ease), color .2s var(--ease);
}
.btn-outline:hover{
  background: var(--ink);
  color: #fff;
}

/* Products list */
.product-list{
  display: grid;
  gap: var(--s-xl);
}
.product-item{
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: var(--s-lg);
  align-items: start;
}
.product-item__visual-wrap{ display: flex; flex-direction: column; gap: 8px; }
.product-item__visual{
  aspect-ratio: 4 / 3;
  background: var(--line-soft);
  overflow: hidden;
  border: 1px solid var(--line);
  display: block;
  position: relative;
  cursor: zoom-in;
}
.product-item__visual img{
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .4s var(--ease);
}
.product-item__visual:hover img{ transform: scale(1.03); }
.product-item__count{
  position: absolute;
  right: 10px; bottom: 10px;
  font-family: var(--ff-en);
  font-size: 11px;
  letter-spacing: .12em;
  color: #fff;
  background: rgba(0,0,0,.6);
  padding: 4px 8px;
}
.product-item__thumbs{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
}
.product-item__thumb{
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--line-soft);
  cursor: zoom-in;
  display: block;
}
.product-item__thumb img{
  width: 100%; height: 100%; object-fit: cover; display: block;
  opacity: .85;
  transition: opacity .2s var(--ease);
}
.product-item__thumb:hover img{ opacity: 1; }

/* Lightbox */
.lightbox{
  position: fixed; inset: 0;
  background: rgba(0,0,0,.92);
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
}
.lightbox.is-open{ display: flex; }
.lightbox__img{
  max-width: min(92vw, 1400px);
  max-height: 86vh;
  object-fit: contain;
  display: block;
}
.lightbox__close,
.lightbox__prev,
.lightbox__next{
  position: fixed;
  background: transparent;
  border: 1px solid rgba(255,255,255,.4);
  color: #fff;
  font-size: 24px;
  width: 48px; height: 48px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.lightbox__close{ top: 24px; right: 24px; font-size: 28px; }
.lightbox__prev{ left: 24px; top: 50%; transform: translateY(-50%); }
.lightbox__next{ right: 24px; top: 50%; transform: translateY(-50%); }
.lightbox__count{
  position: fixed;
  bottom: 24px; left: 50%; transform: translateX(-50%);
  color: #fff; font-family: var(--ff-en); font-size: 12px; letter-spacing: .2em;
}
.product-item__name-ja{
  font-family: var(--ff-jp);
  font-size: 20px;
  font-weight: 400;
  margin: 0 0 4px;
}
.product-item__name-en{
  font-family: var(--ff-en);
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin: 0 0 var(--s-md);
}
.product-item__desc{
  font-size: 13px;
  line-height: 1.8;
  margin: 0 0 var(--s-sm);
}
.product-item__desc--en{
  color: var(--ink-soft);
  font-family: var(--ff-en);
  font-size: 12px;
  line-height: 1.7;
}
.product-item__link{
  font-family: var(--ff-en);
  font-size: 11px;
  letter-spacing: .14em;
  color: var(--ink-soft);
  word-break: break-all;
}
.product-item__link:hover{ color: var(--ink); }
@media (max-width: 720px){
  .product-item{ grid-template-columns: 1fr; }
  .product-item__visual{ aspect-ratio: 3/2; }
}

/* Movie grid (動画2枚横並び) */
.movie-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--s-md);
}
.movie-grid__item{
  margin: 0;
}
.movie-grid__item .yt-embed{
  margin: 0;
}
.movie-grid__caption{
  font-family: var(--ff-en);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-top: var(--s-sm);
}
@media (max-width: 720px){
  .movie-grid{ grid-template-columns: 1fr; }
}

/* Gallery (会場写真) — マガジン風モザイク */
.edition-gallery{
  display: grid;
  gap: 6px;
}
.edition-gallery__item{
  position: relative;
  overflow: hidden;
  background: var(--line-soft);
  display: block;
  cursor: zoom-in;
  border: 1px solid transparent;
}
.edition-gallery__item img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: grayscale(.1) contrast(1.02);
  transition: filter .5s var(--ease), transform .7s var(--ease);
}
.edition-gallery__item:hover img{
  filter: grayscale(0) contrast(1.05);
  transform: scale(1.04);
}
/* ホバー時に微かな白フェード */
.edition-gallery__item::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(0,0,0,.18) 100%);
  opacity: 0;
  transition: opacity .3s var(--ease);
  pointer-events: none;
}
.edition-gallery__item:hover::after{ opacity: 1; }

/* 4枚: 左を大きく、右を2段積み */
.edition-gallery--magazine[data-count="4"]{
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  aspect-ratio: 16 / 9;
}
.edition-gallery--magazine[data-count="4"] .edition-gallery__item:nth-child(1){
  grid-column: 1; grid-row: 1 / span 2;
}
.edition-gallery--magazine[data-count="4"] .edition-gallery__item:nth-child(2){
  grid-column: 2; grid-row: 1;
}
.edition-gallery--magazine[data-count="4"] .edition-gallery__item:nth-child(3){
  grid-column: 3; grid-row: 1;
}
.edition-gallery--magazine[data-count="4"] .edition-gallery__item:nth-child(4){
  grid-column: 2 / span 2; grid-row: 2;
}

/* 3枚: 左大 + 右小×2 */
.edition-gallery--magazine[data-count="3"]{
  grid-template-columns: 2fr 1fr;
  grid-template-rows: 1fr 1fr;
  aspect-ratio: 16 / 9;
}
.edition-gallery--magazine[data-count="3"] .edition-gallery__item:nth-child(1){
  grid-column: 1; grid-row: 1 / span 2;
}

/* 5枚: 左大1 + 右 2×2 のグリッド */
.edition-gallery--magazine[data-count="5"]{
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  aspect-ratio: 16 / 9;
}
.edition-gallery--magazine[data-count="5"] .edition-gallery__item:nth-child(1){
  grid-column: 1; grid-row: 1 / span 2;
}
.edition-gallery--magazine[data-count="5"] .edition-gallery__item:nth-child(2){
  grid-column: 2; grid-row: 1;
}
.edition-gallery--magazine[data-count="5"] .edition-gallery__item:nth-child(3){
  grid-column: 3; grid-row: 1;
}
.edition-gallery--magazine[data-count="5"] .edition-gallery__item:nth-child(4){
  grid-column: 2; grid-row: 2;
}
.edition-gallery--magazine[data-count="5"] .edition-gallery__item:nth-child(5){
  grid-column: 3; grid-row: 2;
}

/* 2枚・6枚以上は単純な 2-3列グリッド */
.edition-gallery--magazine:not([data-count="3"]):not([data-count="4"]):not([data-count="5"]){
  grid-template-columns: repeat(3, 1fr);
}
.edition-gallery--magazine:not([data-count="3"]):not([data-count="4"]):not([data-count="5"]) .edition-gallery__item{
  aspect-ratio: 3 / 2;
}

@media (max-width: 720px){
  .edition-gallery--magazine[data-count="4"],
  .edition-gallery--magazine[data-count="3"],
  .edition-gallery--magazine[data-count="5"]{
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    aspect-ratio: auto;
  }
  .edition-gallery--magazine[data-count="4"] .edition-gallery__item:nth-child(1),
  .edition-gallery--magazine[data-count="4"] .edition-gallery__item:nth-child(4),
  .edition-gallery--magazine[data-count="3"] .edition-gallery__item:nth-child(1),
  .edition-gallery--magazine[data-count="5"] .edition-gallery__item:nth-child(1){
    grid-column: 1 / span 2; grid-row: auto;
  }
  .edition-gallery--magazine[data-count="5"] .edition-gallery__item:nth-child(n+2){
    grid-column: auto; grid-row: auto;
  }
  .edition-gallery--magazine .edition-gallery__item{ aspect-ratio: 3 / 2; }
}

/* =========================================================
   SINGLE EVENT / EXHIBITOR
   ========================================================= */
.single-hero{
  padding: 180px 0 var(--s-lg);
}
.single-hero__kicker{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-bottom: var(--s-sm);
}
.single-hero__title{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:clamp(40px, 6vw, 84px);
  line-height:1.05;
  letter-spacing:-.02em;
}
.single-hero__title small{
  display:block;
  font-family:var(--ff-jp);
  font-size:14px;
  letter-spacing:.22em;
  color:var(--ink-soft);
  margin-top:16px;
}

.single-body{
  display:grid;
  grid-template-columns: 1fr 320px;
  gap: var(--s-xl);
  padding: var(--s-md) 0 0;
  align-items: start;
}
.single-body__map{
  margin: var(--s-md) 0 0;
  border: 1px solid var(--line);
  overflow: hidden;
}
.single-body__map iframe{
  display: block;
  filter: grayscale(1) contrast(1.05);
  transition: filter .3s var(--ease);
}
.single-body__map:hover iframe{ filter: none; }
.single-body__content{
  font-family:var(--ff-jp);
  font-size:15px;
  line-height:2;
  color:var(--ink);
}
.single-body__content h2,
.single-body__content h3{
  font-family:var(--ff-en);
  font-weight:400;
  margin-top: var(--s-lg);
  margin-bottom: var(--s-sm);
  letter-spacing:.02em;
}
.single-body__content p{ margin-bottom: var(--s-sm); }
.single-body__side{
  font-family:var(--ff-jp);
  font-size:13px;
  color:var(--ink-soft);
  line-height:2;
}
.single-body__side dl{
  display:grid;
  grid-template-columns: 100px 1fr;
  gap:10px var(--s-sm);
  margin:0;
}
.single-body__side dt{
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-faint);
}
.single-body__side dd{ margin:0; color:var(--ink); }
.single-body__side dd small{
  display:block;
  font-size: 11px;
  color: var(--ink-faint);
  line-height: 1.6;
  margin-top: 2px;
}

/* 日英分離: dl を2つ並べる。英語ブロックは上に区切り線＋控えめな配色 */
.side-dl + .side-dl{
  margin-top: var(--s-lg);
  padding-top: var(--s-md);
  border-top: 1px solid var(--line);
}
.side-dl--en{
  font-family: var(--ff-en);
}
.side-dl--en dt{ color: var(--ink-faint); }
.side-dl--en dd{ color: var(--ink-soft); font-size: 12px; line-height: 1.7; }
.side-dl--en dd small{ font-size: 10.5px; }

.yt-embed{
  position:relative;
  aspect-ratio: 16 / 9;
  overflow:hidden;
  background:#000;
  margin: var(--s-md) 0;
}
.yt-embed iframe{
  position:absolute; inset:0;
  width:100%; height:100%;
  border:0;
}

/* =========================================================
   WATCH PAGE (FRAT TV)
   ========================================================= */
.watch-series{
  margin-bottom: var(--s-2xl);
}
.watch-series__head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom: var(--s-lg);
  gap: var(--s-md);
  flex-wrap:wrap;
  border-bottom:1px solid var(--line);
  padding-bottom: var(--s-sm);
}
.watch-series__title{
  font-family:var(--ff-en);
  font-weight:300;
  font-size:clamp(24px, 3vw, 36px);
  letter-spacing:.01em;
}
.watch-series__title small{
  display:block;
  font-family:var(--ff-jp);
  font-size:12px;
  letter-spacing:.22em;
  color:var(--ink-soft);
  margin-top:6px;
}
.watch-series__count{
  font-family:var(--ff-en);
  font-size:11px;
  letter-spacing:.2em;
  color:var(--ink-soft);
  text-transform:uppercase;
}
.watch-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s-lg);
}
.watch-item{
  display:flex;
  flex-direction:column;
  gap: var(--s-xs);
}
.watch-item__thumb{
  position:relative;
  aspect-ratio: 16 / 9;
  overflow:hidden;
  background:#000;
}
.watch-item__thumb img{
  width:100%; height:100%; object-fit:cover;
  transition: transform .6s var(--ease);
}
.watch-item:hover .watch-item__thumb img{ transform:scale(1.04); }
.watch-item__thumb::after{
  content:"▶";
  position:absolute;
  top:50%; left:50%;
  transform: translate(-50%,-50%);
  color:#fff;
  font-size:32px;
  opacity:.8;
  text-shadow: 0 2px 8px rgba(0,0,0,.4);
}
.watch-item__meta{
  display:flex;
  gap: var(--s-sm);
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.18em;
  color:var(--ink-soft);
  text-transform:uppercase;
  margin-top:10px;
}
.watch-item__title{
  font-family:var(--ff-jp);
  font-size:15px;
  font-weight:400;
  color:var(--ink);
  line-height:1.6;
  letter-spacing:.04em;
}

/* =========================================================
   CONTACT
   ========================================================= */
.contact-lead{
  max-width: 720px;
  font-family:var(--ff-jp);
  font-size:16px;
  line-height:2.2;
  color:var(--ink);
  margin-bottom: var(--s-xl);
}
.contact-channels{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  margin-bottom: var(--s-xl);
}
.contact-channel{
  padding: var(--s-lg) var(--s-md);
  border-right:1px solid var(--line);
}
.contact-channel:last-child{ border-right:0; }
.contact-channel__label{
  font-family:var(--ff-en);
  font-size:10px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-bottom:8px;
}
.contact-channel__value{
  font-family:var(--ff-en);
  font-size:18px;
  color:var(--ink);
  letter-spacing:.04em;
  word-break:break-all;
}
.contact-channel__note{
  font-family:var(--ff-jp);
  font-size:12px;
  color:var(--ink-soft);
  margin-top:8px;
  line-height:1.8;
}

/* =========================================================
   CONTACT TABS (FRAT .btn 風・4タブ統合フォーム)
   ========================================================= */
.contact-tabs{
  max-width: 1000px;
  margin: 0 auto var(--s-xl);
}
.contact-tabs .tab-nav{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0 0 var(--s-xl);
  padding: 0;
}
.contact-tabs .tab-button{
  flex: 1;
  min-width: 180px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 28px;
  font-family: var(--ff-en);
  font-size: 12px;
  letter-spacing: .24em;
  text-transform: uppercase;
  border: 1px solid var(--ink);
  color: var(--ink);
  background: transparent;
  cursor: pointer;
  transition: color .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.contact-tabs .tab-button:hover{
  background: var(--ink);
  color: var(--bg);
}
.contact-tabs .tab-button.active{
  background: var(--ink);
  color: var(--bg);
  border-color: var(--ink);
}
.contact-tabs .tab-button .btn__arrow{
  width: 18px;
  height: 1px;
  background: currentColor;
  position: relative;
  flex-shrink: 0;
}
.contact-tabs .tab-button .btn__arrow::after{
  content: "";
  position: absolute;
  right: -1px;
  top: -4px;
  width: 8px;
  height: 8px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
}
.contact-tabs .tab-button.disabled,
.contact-tabs .tab-button:disabled{
  opacity: 0.45;
  cursor: not-allowed;
  color: var(--ink-soft);
  border-color: var(--line);
}
.contact-tabs .tab-button.disabled:hover,
.contact-tabs .tab-button:disabled:hover{
  background: transparent;
  color: var(--ink-soft);
}
.contact-tabs .tab-button.disabled::before,
.contact-tabs .tab-button:disabled::before{
  content: attr(data-disabled-label);
  position: absolute;
  bottom: -20px;
  left: 0;
  right: 0;
  text-align: center;
  font-family: var(--ff-jp);
  font-size: 10px;
  letter-spacing: .08em;
  color: var(--ink-soft);
  text-transform: none;
}

/* タブコンテンツ */
.contact-tabs .tab-content{
  display: none;
}
.contact-tabs .tab-content.active{
  display: block;
  animation: contactFadeIn .5s var(--ease);
}
@keyframes contactFadeIn{
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* フォーム説明エリア */
.contact-tabs .form-description{
  padding: 0 0 var(--s-lg);
  margin-bottom: var(--s-lg);
  color: var(--ink);
  border-bottom: 1px solid var(--line-soft);
}
.contact-tabs .form-description h3{
  margin: 0 0 var(--s-md);
  font-family: var(--ff-jp);
  font-weight: 500;
  font-size: 22px;
  letter-spacing: .04em;
  line-height: 1.5;
  color: var(--ink);
}
.contact-tabs .form-description p{
  color: var(--ink);
  font-family: var(--ff-jp);
  font-size: 14px;
  line-height: 2;
  margin: 0 0 var(--s-sm);
}
.contact-tabs .form-description ul{
  margin: var(--s-md) 0 0;
  padding-left: 18px;
  font-family: var(--ff-jp);
  font-size: 13px;
  color: var(--ink-soft);
  line-height: 2;
}
.contact-tabs .form-description ul li{
  margin-bottom: 4px;
}

/* フォームラッパー */
.contact-tabs .contact-form-wrapper{
  padding: 0;
}
.contact-tabs .contact-form-placeholder{
  font-family: var(--ff-jp);
  font-size: 12px;
  color: var(--ink-soft);
  line-height: 2;
  margin: 0;
  padding: var(--s-md);
  background: var(--line-soft);
  border-left: 2px solid var(--ink-soft);
}
.contact-tabs .contact-form-placeholder em{
  font-style: normal;
  color: var(--ink-soft);
}
.contact-tabs .contact-form-placeholder a{
  font-family: var(--ff-en);
  color: var(--ink);
  border-bottom: 1px solid var(--ink);
}

/* フォーム要素 (CF7 フォールバックスタイル) */
.contact-tabs .contact-form-wrapper label{
  font-family: var(--ff-jp);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: .04em;
  margin-bottom: 6px;
  display: block;
  color: var(--ink);
}
.contact-tabs .contact-form-wrapper input[type="text"],
.contact-tabs .contact-form-wrapper input[type="email"],
.contact-tabs .contact-form-wrapper input[type="tel"],
.contact-tabs .contact-form-wrapper textarea,
.contact-tabs .contact-form-wrapper select{
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line);
  background: var(--bg);
  font-family: var(--ff-jp);
  font-size: 14px;
  margin-bottom: var(--s-md);
  color: var(--ink);
}
.contact-tabs .contact-form-wrapper .wpcf7-submit,
.contact-tabs .contact-form-wrapper input[type="submit"]{
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 18px 42px;
  font-family: var(--ff-en);
  font-size: 12px;
  letter-spacing: .24em;
  text-transform: uppercase;
  border: 1px solid var(--ink);
  color: var(--bg);
  background: var(--ink);
  cursor: pointer;
  transition: background .25s var(--ease), color .25s var(--ease);
}
.contact-tabs .contact-form-wrapper .wpcf7-submit:hover,
.contact-tabs .contact-form-wrapper input[type="submit"]:hover{
  background: transparent;
  color: var(--ink);
}

/* Turnstile を submit の上に配置、両方左端揃え、間にスペース */
.contact-tabs .contact-form-wrapper .wpcf7-turnstile.contact-turnstile-above{
  margin: var(--s-xl) 0 var(--s-lg) 0;
  display: block;
}

/* SNS補足エリア */
.contact-sns{
  text-align: center;
  padding: var(--s-xl) 0 0;
  border-top: 1px solid var(--line-soft);
  margin-top: var(--s-xl);
}
.contact-sns__label{
  font-family: var(--ff-jp);
  font-size: 12px;
  color: var(--ink-soft);
  letter-spacing: .04em;
  margin: 0 0 var(--s-sm);
}
.contact-sns__link{
  font-family: var(--ff-en);
  font-size: 16px;
  letter-spacing: .18em;
  color: var(--ink);
  text-decoration: none;
  border-bottom: 1px solid var(--line);
  padding-bottom: 4px;
  transition: border-color .25s var(--ease);
}
.contact-sns__link:hover{
  border-bottom-color: var(--ink);
}

@media (max-width: 720px){
  .contact-tabs .tab-nav{ gap: 8px; }
  .contact-tabs .tab-button{
    min-width: calc(50% - 4px);
    padding: 14px 18px;
    font-size: 11px;
  }
}

/* =========================================================
   REVEAL ANIM
   ========================================================= */
/* JS 未ロード時は常に可視 (真っ白防止) */
.reveal{
  opacity: 1;
  transform: none;
}
/* JS が reveal 初期化済みの時だけフェードイン制御を有効化 */
html.js-ready .reveal{
  opacity:0;
  transform: translateY(16px);
  transition: opacity .9s var(--ease), transform .9s var(--ease);
  will-change: opacity, transform;
}
html.js-ready .reveal.is-in{
  opacity:1;
  transform: translateY(0);
}
/* ファーストビュー (ヒーロー/ページヘッダ) は JS不要の軽いフェードインを CSS だけで付与 */
@keyframes first-in {
  0%   { opacity: 0;  transform: translateY(24px); }
  20%  { opacity: .15; }
  100% { opacity: 1;  transform: none; }
}
.single-hero .reveal,
.page-head .reveal,
.hero .reveal{
  opacity: 1 !important;
  transform: none !important;
  animation: first-in 1.4s var(--ease) both;
}
@media (prefers-reduced-motion: reduce){
  .single-hero .reveal,
  .page-head .reveal,
  .hero .reveal{ animation: none; }
}

/* =========================================================
   PAGINATION
   ========================================================= */
.pager{
  display:flex;
  justify-content:center;
  gap: var(--s-sm);
  padding: var(--s-xl) 0;
  font-family:var(--ff-en);
  font-size:12px;
  letter-spacing:.18em;
}
.pager a, .pager span{
  padding: 10px 16px;
  border:1px solid var(--line);
  color:var(--ink);
  min-width: 44px;
  text-align:center;
}
.pager .current{
  background:var(--ink);
  color:#fff;
  border-color:var(--ink);
}
.pager a:hover{ border-color:var(--ink); }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 1024px){
  :root{ --gutter: 28px; --s-3xl: 140px; --s-2xl: 110px; --s-xl: 72px; --s-lg: 48px; }
  .hero__stage{ grid-template-columns: 1fr; gap: var(--s-md); height:auto; min-height:auto; padding-top: var(--s-md); }
  .hero__number svg{ height: 62vh; max-height: 520px; width: 92vw; margin:0 auto; }
  .hero__counter{ left: 24px; top: 10%; }
  .hero__pen{ height:auto; }
  .hero__foot{ padding-bottom: 48px; }
  .pillars{ grid-template-columns: 1fr; }
  .pillar{ border-right:0; border-bottom:1px solid var(--line); min-height: auto; padding: var(--s-lg) 0; }
  .pillar:last-child{ border-bottom:0; }
  .next{ grid-template-columns: 1fr; }
  .next__side{ border-left:0; padding-left:0; }
  .booster{ grid-template-columns: repeat(2, 1fr); }
  .press{ grid-template-columns: repeat(2, 1fr); gap: var(--s-md); }
  .timeline{ grid-template-columns: 1fr; }
  .tl-col{ border-left:0; padding: var(--s-lg) 0; border-top:1px solid var(--line); }
  .tl-col:first-child{ border-top:0; padding-top:0; }
  .about__stats{ grid-template-columns: repeat(2, 1fr); }
  .about__stat:nth-child(2){ border-right:0; }
  .about__stat:nth-child(1), .about__stat:nth-child(2){ border-bottom:1px solid var(--line); }
  .footer__grid{ grid-template-columns: 1fr 1fr; }
  .nav{ display:none; }
  .menu-toggle{ display:block; }
  .exhibitor-grid{ grid-template-columns: repeat(4, 1fr); }
  .watch-grid{ grid-template-columns: repeat(2, 1fr); }
  .single-body{ grid-template-columns: 1fr; }
  .contact-channels{ grid-template-columns: 1fr; }
  .contact-channel{ border-right:0; border-bottom:1px solid var(--line); }
  .contact-channel:last-child{ border-bottom:0; }
  .about__corp{ grid-template-columns: 1fr; gap: 4px; }
  .tsw-banner__inner{ grid-template-columns: 1fr; text-align:center; gap: var(--s-sm); }
}
@media (max-width: 720px){
  body{ font-size:14px; }
  .site-header__inner{ grid-template-columns: auto 1fr auto; height:60px; }
  .brand__img{ height:24px; }
  .hero__strip{ font-size:10px; padding-top:90px; }
  .hero__strip .right{ display:none; }
  .hero__number svg{ height:54vh; width: 88vw; max-height: 440px; }
  .hero__tagline .tl-en{ font-size:12px; letter-spacing:.34em; }
  .hero__tagline .tl-jp{ font-size:11px; letter-spacing:.22em; }
  .hero__scroll{ left:14px; bottom:44px; }
  .hero__dateline{ right:14px; bottom:44px; }
  .booster{ grid-template-columns: 1fr; }
  .footer__grid{ grid-template-columns: 1fr; }
  .footer__col--nav{ align-items:flex-start; justify-content:flex-start; }
  .footer__col--nav ul{ text-align:left; }
  .pillar__t{ font-size:30px; }
  .next__kicker{ font-size:56px; }
  .ink-trail{ display:none; }
  .exhibitor-grid{ grid-template-columns: repeat(2, 1fr); }
  .watch-grid{ grid-template-columns: 1fr; }
  .about__stats{ grid-template-columns: 1fr; }
  .about__stat{ border-right:0; border-bottom:1px solid var(--line); }
  .about__stat:last-child{ border-bottom:0; }
  .page-head{ padding: 130px 0 var(--s-lg); }
  .single-hero{ padding: 130px 0 var(--s-md); }
}
@media (prefers-reduced-motion: reduce){
  .hero__number .n-path,
  .hero__number .n-fill,
  .hero__pen,
  .hero__tagline,
  .hero__scroll,
  .hero__dateline,
  .reveal{
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform:none !important;
    stroke-dashoffset: 0 !important;
  }
  .hero__washi{ opacity:1 !important; transition:none !important; }
  .ink-trail{ display:none; }
}
