/* ============================================================
   MUGnet — Design System v5.1
   Game Brand Art Direction + IT-grade Information Design
   ============================================================ */

:root {
  --c-black: #0B0C10;
  --c-white: #F5F6F7;
  --c-gray: #A7ABB3;
  --c-gray-light: #d8d9dc;
  --c-gray-dark: #6b6e76;
  --c-cyan: #83BDCB;
  --c-indigo: #545077;
  --c-ice: #CEE0E9;
  --c-deep: #292233;
  --c-jtd: #292233;
  --c-jtd-accent: #7d799e;
  --c-bonten: #cee0e9;
  --c-bonten-text: #18252a;
  --c-bonten-accent: #588c9a;
  --c-music-bg: #11101A;

  --f-ui: 'Zen Kaku Gothic New', 'Noto Sans JP', -apple-system, BlinkMacSystemFont, sans-serif;
  --f-brand: 'Noto Serif JP', 'Yu Mincho', 'Hiragino Mincho ProN', serif;

  --max-w: 1200px;
  --header-h: 72px;
  --ease: cubic-bezier(0.25, 0, 0.15, 1);
  --dur: 0.5s;
  --dur-fast: 0.25s;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; scroll-behavior: smooth; }
body {
  font-family: var(--f-ui); font-weight: 400; font-size: 1rem;
  line-height: 1.8; color: var(--c-black); background: var(--c-white);
  overflow-x: hidden; -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: opacity var(--dur-fast) var(--ease); }
a:hover { opacity: 0.65; }
ul, ol { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
h1,h2,h3,h4,h5,h6 { font-weight: 700; line-height: 1.3; }

:focus-visible { outline: 2px solid var(--c-cyan); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:0.01ms!important; transition-duration:0.01ms!important; }
  .reveal { opacity:1; transform:none; }
}

.container { width:100%; max-width:var(--max-w); margin:0 auto; padding:0 clamp(1.5rem,5vw,3rem); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }

/* --- Loading --- */
#loading {
  position:fixed; inset:0; z-index:9999; background:var(--c-black);
  display:flex; align-items:center; justify-content:center;
  transition: opacity 0.6s var(--ease), visibility 0.6s;
}
#loading.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.page-ready main,.page-ready .site-header,.page-ready .site-footer { animation:fadeIn 0.6s var(--ease) both; }
@keyframes fadeIn { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
#loading .loading-logo { display:flex; flex-direction:column; align-items:center; gap:1.5rem; }
#loading .loading-logo img { width:180px; height:auto; filter:brightness(0) invert(1); opacity:0; animation:fadeUp 0.5s var(--ease) 0.15s forwards; }
.loading-bar { width:180px; height:1px; background:rgba(255,255,255,0.12); position:relative; overflow:hidden; }
.loading-bar::after { content:''; position:absolute; left:0; top:0; height:100%; width:var(--bar-progress,0%); background:var(--c-cyan); transition:width 0.3s ease; }
@keyframes fadeUp { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }

/* =========================
   HEADER
   ========================= */
.site-header {
  position:fixed; top:0; left:0; width:100%; z-index:1100;
  height:var(--header-h); display:flex; align-items:center;
  transition: background var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.site-header.scrolled { background:rgba(11,12,16,0.95); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.header-inner { display:flex; align-items:center; justify-content:space-between; width:100%; max-width:var(--max-w); margin:0 auto; padding:0 clamp(1.5rem,5vw,3rem); }
.site-logo a { display:block; line-height:1; }
.site-logo img { height:22px; width:auto; }

.nav-desktop { display:flex; align-items:center; gap:clamp(1rem,2vw,1.8rem); }
.nav-desktop a { font-size:0.85rem; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; color:var(--c-gray); position:relative; padding:0.25rem 0; }
.nav-desktop a::after { content:''; position:absolute; bottom:0; left:0; width:0; height:1.5px; background:var(--c-cyan); transition:width var(--dur-fast) var(--ease); }
.nav-desktop a:hover { opacity:1; color:var(--c-white); }
.nav-desktop a:hover::after { width:100%; }
.nav-desktop a.nav-contact { margin-left:0.5rem; padding:0.4rem 1rem; border:1px solid var(--c-gray-dark); }
.nav-desktop a.nav-contact::after { display:none; }
.nav-desktop a.nav-contact:hover { background:var(--c-cyan); color:var(--c-black); border-color:var(--c-cyan); }

.hamburger { display:none; width:32px; height:32px; position:relative; z-index:1100; }
.hamburger span { position:absolute; left:4px; width:24px; height:1.5px; background:var(--c-white); transition:all var(--dur-fast) var(--ease); }
.hamburger span:nth-child(1){top:10px} .hamburger span:nth-child(2){top:15.5px} .hamburger span:nth-child(3){top:21px}
.hamburger.active span:nth-child(1){top:15.5px;transform:rotate(45deg)}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){top:15.5px;transform:rotate(-45deg)}

.nav-mobile { position:fixed; inset:0; z-index:1050; background:var(--c-black); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1.5rem; opacity:0; visibility:hidden; transition:opacity var(--dur) var(--ease),visibility var(--dur); }
.nav-mobile.open { opacity:1; visibility:visible; }
.nav-mobile a { font-family:var(--f-ui); font-size:clamp(1.5rem,5vw,2rem); font-weight:500; color:var(--c-white); letter-spacing:0.06em; opacity:0; transform:translateY(16px); transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease); }
.nav-mobile.open a { opacity:1; transform:translateY(0); }
.nav-mobile.open a:nth-child(1){transition-delay:0.04s} .nav-mobile.open a:nth-child(2){transition-delay:0.07s} .nav-mobile.open a:nth-child(3){transition-delay:0.10s} .nav-mobile.open a:nth-child(4){transition-delay:0.13s} .nav-mobile.open a:nth-child(5){transition-delay:0.16s} .nav-mobile.open a:nth-child(6){transition-delay:0.19s} .nav-mobile.open a:nth-child(7){transition-delay:0.22s} .nav-mobile.open a:nth-child(8){transition-delay:0.25s} .nav-mobile.open a:nth-child(9){transition-delay:0.28s} .nav-mobile.open a:nth-child(10){transition-delay:0.31s}
.nav-mobile a:hover { opacity:0.5; }
@media(max-width:768px){.nav-desktop{display:none}.hamburger{display:block}}

/* =========================
   REVEAL
   ========================= */
.reveal { opacity:0; transform:translateY(24px); transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease); }
.reveal.is-visible { opacity:1; transform:translateY(0); }
.reveal-delay-1{transition-delay:0.08s} .reveal-delay-2{transition-delay:0.16s} .reveal-delay-3{transition-delay:0.24s}

/* =========================
   BUTTONS
   ========================= */
.btn { display:inline-flex; align-items:center; justify-content:center; padding:0.7rem 1.6rem; font-size:0.85rem; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; border:1px solid var(--c-black); color:var(--c-black); background:transparent; transition:all var(--dur-fast) var(--ease); white-space:nowrap; }
.btn:hover { background:var(--c-black); color:var(--c-white); opacity:1; }
.btn--primary { background:var(--c-black); color:var(--c-white); }
.btn--primary:hover { background:var(--c-gray-dark); }
.btn--booth { border-color:#8b7355; color:#8b7355; }
.btn--booth:hover { background:#8b7355; color:var(--c-white); opacity:1; }
.btn--cyan { border-color:var(--c-cyan); color:var(--c-cyan); }
.btn--cyan:hover { background:var(--c-cyan); color:var(--c-black); opacity:1; }
.btn--white { border-color:var(--c-white); color:var(--c-white); }
.btn--white:hover { background:var(--c-white); color:var(--c-black); opacity:1; }
.btn--sm { padding:0.5rem 1.2rem; font-size:0.85rem; }

.link-arrow { display:inline-flex; align-items:center; gap:0.5rem; font-size:0.85rem; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; color:var(--c-gray-dark); transition:color var(--dur-fast); }
.link-arrow::after { content:'\2192'; transition:transform var(--dur-fast) var(--ease); }
.link-arrow:hover { opacity:1; color:var(--c-black); }
.link-arrow:hover::after { transform:translateX(3px); }
.link-arrow--white { color:var(--c-gray); }
.link-arrow--white:hover { color:var(--c-white); }

/* =========================
   HERO
   ========================= */
.hero { position:relative; width:100%; min-height:100vh; min-height:100svh; display:flex; align-items:flex-end; padding-bottom:clamp(3rem,8vh,6rem); overflow:hidden; }
.hero-bg { position:absolute; inset:0; z-index:-1; background:var(--c-black); }
.hero-bg picture,.hero-bg img { width:100%; height:100%; object-fit:cover; }
.hero-bg::after { content:''; position:absolute; inset:0; background:rgba(11,12,16,0.34); }
.hero-content { position:relative; z-index:1; color:var(--c-white); }
.hero-brand-label { display:block; font-size:0.85rem; font-weight:500; letter-spacing:0.3em; text-transform:uppercase; opacity:0.5; margin-bottom:0.75rem; }
.hero-tagline { font-family:var(--f-brand); font-size:clamp(2.5rem,7vw,5rem); font-weight:300; line-height:1.15; letter-spacing:0.03em; }

/* =========================
   SECTION
   ========================= */
.section { padding:clamp(5rem,12vh,10rem) 0; }
.section--black { background:var(--c-black); color:var(--c-white); }
.section--deep { background:var(--c-deep); color:var(--c-white); }
.section--music { background:var(--c-music-bg); color:var(--c-white); }
.section-title { font-family:var(--f-brand); font-size:clamp(1.65rem,3vw,2.25rem); font-weight:500; letter-spacing:-0.02em; }
.section--black .section-title,.section--deep .section-title,.section--music .section-title { color:var(--c-white); }

/* =========================
   NEWS
   ========================= */
.news-list { display:flex; flex-direction:column; max-width:780px; }
.news-list .news-item { display:flex; align-items:baseline; gap:2rem; padding:1.2rem 0; border-bottom:1px solid var(--c-gray-light); transition:background var(--dur-fast); }
.news-list .news-item:first-child { border-top:1px solid var(--c-gray-light); }
.news-list .news-item:hover { background:rgba(0,0,0,0.02); }
.news-date { flex-shrink:0; font-size:0.85rem; font-weight:500; font-variant-numeric:tabular-nums; color:var(--c-gray); letter-spacing:0.04em; min-width:80px; }
.news-category { flex-shrink:0; font-size:0.85rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--c-cyan); min-width:70px; }
.news-content h3 { font-family:var(--f-ui); font-size:1.0rem; font-weight:500; line-height:1.5; }
.news-content p { font-size:0.9rem; color:var(--c-gray-dark); line-height:1.6; margin-top:0.25rem; }
.news-content p a { color:var(--c-black); text-decoration:underline; text-underline-offset:3px; }
.news-content p a:hover { color:var(--c-cyan); }
.news-more { display:inline-flex; align-items:center; gap:0.5rem; font-size:0.85rem; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; margin-top:2rem; color:var(--c-gray-dark); transition:color var(--dur-fast); }
.news-more::after { content:'\2192'; transition:transform var(--dur-fast) var(--ease); }
.news-more:hover { opacity:1; color:var(--c-black); }
.news-more:hover::after { transform:translateX(3px); }
.news-empty { padding:2.5rem; text-align:center; color:var(--c-gray); }
.news-archive { display:flex; flex-direction:column; max-width:800px; margin:0 auto; }
.news-archive .news-item { display:grid; grid-template-columns:120px 1fr; gap:1.5rem; padding:1.5rem 0; border-bottom:1px solid var(--c-gray-light); }
.news-archive .news-item:first-child { border-top:1px solid var(--c-gray-light); }
@media(max-width:640px){.news-archive .news-item{grid-template-columns:1fr;gap:0.4rem;padding:1.2rem 0}}

/* =========================
   FEATURED (full width KV)
   ========================= */
.featured-full { position:relative; width:100%; }
.featured-full img { width:100%; height:auto; display:block; }
.featured-full__info { padding:clamp(3rem,8vh,6rem) 0; }
.featured-full__inner { max-width:640px; }
.featured-full__label { font-size:0.85rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--c-cyan); margin-bottom:1rem; }
.featured-full__title { font-family:var(--f-brand); font-size:clamp(2rem,5vw,3.5rem); font-weight:300; line-height:1.15; margin-bottom:1.5rem; }
.featured-full__desc { font-size:1.0rem; line-height:2; color:var(--c-gray); margin-bottom:1.5rem; }
.featured-full__meta { display:flex; flex-wrap:wrap; gap:1rem; font-size:0.85rem; color:var(--c-gray); margin-bottom:2rem; }
.featured-full__actions { display:flex; flex-wrap:wrap; gap:0.75rem; }

/* =========================
   ABOUT (split)
   ========================= */
.about-split { display:grid; grid-template-columns:1fr 1fr; gap:clamp(3rem,6vw,6rem); align-items:center; }
.about-split__text p { font-size:1.0rem; line-height:2; color:var(--c-gray-dark); margin-bottom:1.5rem; }
.about-split__highlight { font-family:var(--f-brand); font-size:clamp(1.6rem,3.5vw,2.2rem); font-weight:300; color:var(--c-black); letter-spacing:0.04em; line-height:1.4; margin-bottom:2rem; padding-left:1.5rem; border-left:2px solid var(--c-cyan); }
.about-split__collage { display:grid; grid-template-columns:1fr 1fr; gap:0.5rem; }
.about-split__collage img { width:100%; height:100%; object-fit:cover; aspect-ratio:1; }
.about-split__stats { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; margin-top:2rem; }
.stat-item { text-align:center; }
.stat-item__number { display:block; font-family:var(--f-ui); font-size:clamp(1.8rem,3vw,2.5rem); font-weight:700; color:var(--c-black); line-height:1.2; }
.stat-item__label { display:block; font-size:0.85rem; font-weight:500; letter-spacing:0.15em; text-transform:uppercase; color:var(--c-gray); margin-top:0.3rem; }
@media(max-width:768px){.about-split{grid-template-columns:1fr}.about-split__collage{grid-template-columns:1fr 1fr}}

/* =========================
   WORKS (per-work sections)
   ========================= */
.works-section { position:relative; width:100%; overflow:hidden; }
.works-section__visual { width:100%; position:relative; }
.works-section__visual img { width:100%; height:auto; display:block; }
.works-section__info { padding:clamp(3rem,6vh,5rem) clamp(1.5rem,5vw,3rem); }
.works-section__number { font-size:0.85rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--c-cyan); margin-bottom:0.75rem; }
.works-section__title { font-family:var(--f-brand); font-size:clamp(1.8rem,4vw,2.8rem); font-weight:300; line-height:1.2; margin-bottom:1rem; }
.works-section__desc { font-size:1.0rem; line-height:2; color:var(--c-gray-dark); margin-bottom:1.5rem; max-width:560px; }
.works-section__meta { display:flex; flex-wrap:wrap; gap:1rem; font-size:0.85rem; color:var(--c-gray); margin-bottom:1.5rem; }
.works-section__actions { display:flex; flex-wrap:wrap; gap:0.75rem; }

.works-section--jtd { background:var(--c-jtd); color:var(--c-white); }
.works-section--jtd .works-section__number { color:var(--c-jtd-accent); }
.works-section--jtd .works-section__desc { color:rgba(255,255,255,0.7); }
.works-section--jtd .works-section__meta { color:rgba(255,255,255,0.5); }

.works-section--bonten { background:var(--c-bonten); color:var(--c-bonten-text); }
.works-section--bonten .works-section__number { color:var(--c-bonten-accent); }
.works-section--bonten .works-section__desc { color:rgba(24,37,42,0.7); }
.works-section--bonten .works-section__meta { color:rgba(24,37,42,0.5); }

/* =========================
   VISUAL INTERLUDE
   ========================= */
.visual-interlude { position:relative; width:100%; min-height:60vh; display:flex; align-items:center; justify-content:center; overflow:hidden; background:var(--c-black); }
.visual-interlude img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.visual-interlude__grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:0.5rem; padding:clamp(2rem,5vw,4rem); max-width:1400px; width:100%; }
.visual-interlude__item { aspect-ratio:1; overflow:hidden; }
.visual-interlude__item img { width:100%; height:100%; object-fit:cover; transition:transform var(--dur) var(--ease); }
.visual-interlude__item:hover img { transform:scale(1.05); }
.visual-interlude__cta { position:relative; z-index:1; text-align:center; padding:2rem; }
@media(max-width:640px){.visual-interlude__grid{grid-template-columns:1fr 1fr}}

/* =========================
   MUSIC LABEL
   ========================= */
.music-hero { text-align:center; padding:clamp(4rem,10vh,8rem) 0 clamp(2rem,5vh,4rem); }
.music-hero__title { font-family:var(--f-ui); font-size:clamp(2rem,5vw,3.5rem); font-weight:700; color:var(--c-white); line-height:1.2; }
.music-hero__sub { font-size:0.85rem; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; color:var(--c-gray); margin-top:1rem; }

.music-release { display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(3rem,6vw,6rem); align-items:center; padding:clamp(3rem,8vh,6rem) 0; }
.music-release__art { aspect-ratio:1; overflow:hidden; background:#1a1a2e; }
.music-release__art img { width:100%; height:100%; object-fit:cover; }
.music-release__info { display:flex; flex-direction:column; gap:1rem; }
.music-release__type { font-size:0.85rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--c-cyan); }
.music-release__title { font-family:var(--f-brand); font-size:clamp(1.4rem,3vw,2rem); font-weight:300; line-height:1.3; }
.music-release__date { font-size:0.85rem; color:var(--c-gray); }
.music-release__desc { font-size:0.95rem; color:var(--c-gray); line-height:1.8; }
.music-release__links { display:flex; gap:1rem; margin-top:0.5rem; }
@media(max-width:768px){.music-release{grid-template-columns:1fr}}

.music-releases { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr)); gap:1.5rem; }
.music-card { border:1px solid rgba(255,255,255,0.1); padding:1.5rem; display:flex; flex-direction:column; gap:0.6rem; transition:border-color var(--dur-fast); }
.music-card:hover { border-color:var(--c-cyan); opacity:1; }
.music-card__type { font-size:0.85rem; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; color:var(--c-cyan); }
.music-card__title { font-family:var(--f-ui); font-size:1.05rem; font-weight:500; line-height:1.4; }
.music-card__date { font-size:0.85rem; color:var(--c-gray); }
.music-card__desc { font-size:0.88rem; color:var(--c-gray); line-height:1.6; }

/* =========================
   FROM THE GAMES (screenshots)
   ========================= */
.screenshots { display:grid; grid-template-columns:2fr 1fr; grid-template-rows:auto auto; gap:0.5rem; max-width:1400px; margin:0 auto; }
.screenshots__main { grid-row:1/3; aspect-ratio:16/10; overflow:hidden; }
.screenshots__sub { aspect-ratio:16/10; overflow:hidden; }
.screenshots img { width:100%; height:100%; object-fit:cover; transition:transform var(--dur) var(--ease); }
.screenshots img:hover { transform:scale(1.03); }
@media(max-width:768px){.screenshots{grid-template-columns:1fr}}

/* =========================
   INSIDE MUGnet
   ========================= */
.inside-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0.5rem; }
.inside-grid__item { aspect-ratio:4/3; overflow:hidden; position:relative; }
.inside-grid__item img { width:100%; height:100%; object-fit:cover; transition:transform var(--dur) var(--ease); }
.inside-grid__item:hover img { transform:scale(1.05); }
.inside-grid__item--wide { grid-column:span 2; }
@media(max-width:768px){.inside-grid{grid-template-columns:1fr 1fr}.inside-grid__item--wide{grid-column:span 2}}

/* =========================
   HISTORY (tree)
   ========================= */
.history-tree { max-width:700px; }
.history-year { margin-bottom:3rem; }
.history-year__label { font-family:var(--f-ui); font-size:1.2rem; font-weight:700; margin-bottom:1rem; padding-bottom:0.5rem; border-bottom:2px solid var(--c-cyan); }
.history-events { display:flex; flex-direction:column; padding-left:1.5rem; border-left:1px solid var(--c-gray-light); }
.history-event { position:relative; padding:0.75rem 0 0.75rem 1.5rem; }
.history-event::before { content:''; position:absolute; left:-4px; top:1.1rem; width:7px; height:7px; background:var(--c-cyan); border-radius:50%; }
.history-event__date { font-size:0.85rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--c-gray); }
.history-event__text { font-size:0.98rem; font-weight:500; line-height:1.5; }

/* =========================
   MEDIA
   ========================= */
.media-list { display:flex; flex-direction:column; gap:0; max-width:800px; }
.media-item { display:flex; flex-direction:column; gap:0.4rem; padding:1.5rem 0; border-bottom:1px solid rgba(255,255,255,0.08); color:var(--c-white); transition:opacity var(--dur-fast); }
.media-item:first-child { border-top:1px solid rgba(255,255,255,0.08); }
.media-item:hover { opacity:0.7; }
.media-item__source { font-size:0.85rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--c-cyan); }
.media-item__title { font-size:1.02rem; font-weight:500; line-height:1.5; }
.media-item__desc { font-size:0.85rem; color:var(--c-gray); line-height:1.5; }
.media-item__img { width:100%; aspect-ratio:16/9; overflow:hidden; margin-bottom:0.5rem; background:var(--c-deep); }
.media-item__img img { width:100%; height:100%; object-fit:cover; transition:transform var(--dur) var(--ease); }
.media-item:hover .media-item__img img { transform:scale(1.05); }

/* =========================
   GOODS
   ========================= */
.goods-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr)); gap:1.5rem; }
.goods-card { text-align:center; }
.goods-card__img { aspect-ratio:1; overflow:hidden; background:var(--c-gray-light); margin-bottom:1rem; display:flex; align-items:center; justify-content:center; }
.goods-card__img img { width:100%; height:100%; object-fit:contain; }
.goods-card__name { font-size:0.95rem; font-weight:500; margin-bottom:0.25rem; }
.goods-card__price { font-size:0.85rem; color:var(--c-gray); }

/* =========================
   GALLERY / MODAL
   ========================= */
.gallery-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(0.4rem,1vw,0.8rem); }
.gallery-item { position:relative; aspect-ratio:1; overflow:hidden; cursor:pointer; }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition:transform var(--dur) var(--ease); }
.gallery-item::after { content:''; position:absolute; inset:0; background:rgba(0,0,0,0); transition:background var(--dur-fast); }
.gallery-item:hover img { transform:scale(1.05); }
.gallery-item:hover::after { background:rgba(0,0,0,0.15); }
@media(max-width:640px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}

.modal-overlay { position:fixed; inset:0; z-index:2000; background:rgba(11,12,16,0.94); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity var(--dur-fast) var(--ease),visibility var(--dur-fast); padding:2rem; }
.modal-overlay.open { opacity:1; visibility:visible; }
.modal-close { position:absolute; top:1.5rem; right:1.5rem; width:40px; height:40px; color:var(--c-white); font-size:1.5rem; display:flex; align-items:center; justify-content:center; z-index:10; cursor:pointer; }
.modal-body { max-width:900px; width:100%; text-align:center; }
.modal-body img { max-height:70vh; width:auto; max-width:100%; margin:0 auto; }
.modal-info { color:var(--c-white); margin-top:1.5rem; }
.modal-info h3 { font-size:1.2rem; font-weight:500; margin-bottom:0.3rem; }
.modal-info p { font-size:0.88rem; color:var(--c-gray); }
.modal-body--member { max-width:560px; background:var(--c-white); color:var(--c-black); padding:clamp(2rem,5vw,3rem); text-align:left; }
.modal-body--member .modal-info { color:var(--c-black); margin-top:0; }
.modal-body--member .modal-info h3 { font-size:1.3rem; margin-bottom:0.2rem; }
.modal-body--member .modal-role { font-size:0.85rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--c-cyan); margin-bottom:1.5rem; display:block; }
.modal-body--member .modal-desc { font-size:0.95rem; line-height:1.8; color:var(--c-gray-dark); }

/* =========================
   MEMBERS
   ========================= */
.members-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr)); gap:1rem; }
.member-card { min-height:190px; padding:1.75rem; background:var(--c-white); border:1px solid var(--c-gray-light); cursor:pointer; transition:border-color var(--dur-fast), background var(--dur-fast); }
.member-card:hover,.member-card:focus-visible { background:var(--c-white); border-color:var(--c-gray-dark); opacity:1; }
.member-card__name { margin-bottom:.35rem; font-family:var(--f-brand); font-size:1.2rem; font-weight:500; line-height:1.4; }
.member-card__role { font-size:0.85rem; font-weight:500; letter-spacing:0.1em; color:var(--c-gray-dark); }
.member-card__summary { margin-top:1rem; color:var(--c-gray-dark); font-size:0.88rem; line-height:1.8; }

/* =========================
   CONTACT
   ========================= */
.contact-layout { display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(3rem,6vw,6rem); align-items:start; }
.contact-intro h3 { font-size:1.5rem; font-weight:700; margin-bottom:1rem; }
.contact-intro p { font-size:0.95rem; line-height:1.8; color:var(--c-gray-dark); }
.contact-categories { display:flex; flex-direction:column; gap:0.6rem; margin-top:2rem; }
.contact-category { display:flex; align-items:center; gap:0.75rem; padding:0.7rem 1rem; border:1px solid var(--c-gray-light); font-size:0.88rem; color:var(--c-gray-dark); transition:border-color var(--dur-fast); }
.contact-category:hover { border-color:var(--c-black); opacity:1; }
.contact-category__icon { width:28px; height:28px; display:flex; align-items:center; justify-content:center; background:var(--c-black); color:var(--c-white); font-size:0.85rem; font-weight:700; flex-shrink:0; }
@media(max-width:768px){.contact-layout{grid-template-columns:1fr}}

.form-group { margin-bottom:1.5rem; }
.form-group label { display:block; font-size:0.85rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--c-gray); margin-bottom:0.5rem; }
.form-group input,.form-group textarea,.form-group select { width:100%; padding:0.8rem 0; font-family:var(--f-ui); font-size:1.02rem; border:none; border-bottom:1px solid var(--c-gray-light); background:transparent; color:var(--c-black); transition:border-color var(--dur-fast); outline:none; border-radius:0; -webkit-appearance:none; }
.form-group input:focus,.form-group textarea:focus,.form-group select:focus { border-bottom-color:var(--c-black); }
.form-group textarea { resize:vertical; min-height:120px; line-height:1.8; }
.form-group .required { color:var(--c-cyan); margin-left:0.2rem; }
.hp-field { display:none!important; }
.form-status { margin-top:1rem; padding:1rem; font-size:0.95rem; display:none; }
.form-status.success { display:block; background:#e8f5e9; color:#2e7d32; }
.form-status.error { display:block; background:#fce4ec; color:#c62828; }

/* =========================
   SUPPORT
   ========================= */
.support-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr)); gap:1px; background:var(--c-gray-light); }
.support-card { padding:2rem; background:var(--c-white); transition:background var(--dur-fast); }
.support-card:hover { background:var(--c-gray-light); opacity:1; }
.support-card__title { font-size:1.1rem; font-weight:700; margin-bottom:0.75rem; }

/* =========================
   CTA
   ========================= */
.cta-section { text-align:center; }
.cta-section .section-title { margin-bottom:1rem; }
.cta-section p { font-size:0.98rem; color:var(--c-gray-dark); margin-bottom:2rem; }

/* =========================
   PAGE HEADER
   ========================= */
.page-header { padding-top:calc(var(--header-h) + clamp(3rem,8vh,6rem)); padding-bottom:clamp(2rem,5vh,4rem); }
.page-header .section-title { font-size:clamp(2rem,6vw,3.5rem); }
.page-header .section-desc { font-size:0.98rem; color:var(--c-gray-dark); line-height:1.8; margin-top:1rem; max-width:600px; }

/* =========================
   PRESS KIT / 404
   ========================= */
.presskit-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr)); gap:1px; background:var(--c-gray-light); }
.presskit-item { padding:2rem; background:var(--c-white); }
.presskit-item__title { font-size:1rem; font-weight:700; margin-bottom:0.75rem; }
.presskit-item__desc { font-size:0.9rem; color:var(--c-gray-dark); line-height:1.7; margin-bottom:1rem; }
.presskit-links { display:flex; flex-wrap:wrap; gap:.75rem; }

.error-page { min-height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; }
.error-page__code { font-family:var(--f-ui); font-size:clamp(6rem,15vw,12rem); font-weight:700; color:var(--c-gray-light); line-height:1; margin-bottom:1rem; }
.error-page__message { font-size:1rem; color:var(--c-gray-dark); margin-bottom:2rem; }
.error-page__links { display:flex; gap:1rem; justify-content:center; }

/* =========================
   SCROLLBAR / SELECTION / PRINT
   ========================= */
::-webkit-scrollbar{width:6px} ::-webkit-scrollbar-track{background:var(--c-white)} ::-webkit-scrollbar-thumb{background:var(--c-gray-light)} ::-webkit-scrollbar-thumb:hover{background:var(--c-gray)}
::selection{background:var(--c-ice);color:var(--c-black)}
@media print{.site-header,.nav-mobile,#loading,.hamburger,.modal-overlay{display:none!important}body{color:#000;background:#fff}}

/* ============================================================
   Compatibility + portal pass
   Keep the classes used by the existing subpages intact.
   ============================================================ */
:root {
  --c-gray-100: #e5e7ea;
  --c-gray-500: #737780;
  --c-gray-700: #545861;
  --f-heading: var(--f-brand);
  --duration: var(--dur);
  --duration-fast: var(--dur-fast);
}

html, body { overflow-x: clip; }
body { background: var(--c-white); }
.section { padding-block: clamp(4rem, 8vw, 6.25rem); }
.section--alt { background: var(--c-white); color: var(--c-black); border-top:1px solid var(--c-gray-light); }
.container--narrow { max-width: 900px; }
.section-header { display:flex; align-items:flex-end; justify-content:space-between; gap:1.5rem; margin-bottom:2.25rem; }
.section-header .section-title { margin:0; }
.section-header .link-arrow { flex-shrink:0; }
.section-desc { max-width: 620px; color: var(--c-gray-dark); line-height:1.8; margin-top:1rem; }

/* The v4 news class is also used by the homepage fallback. */
.news-latest { display:flex; flex-direction:column; max-width:800px; }
.news-latest .news-item { display:grid; grid-template-columns:120px minmax(0, 1fr); gap:1.5rem; padding:1.15rem 0; border-bottom:1px solid var(--c-gray-light); }
.news-latest .news-item:first-child { border-top:1px solid var(--c-gray-light); }
.news-latest .news-date { color:var(--c-gray-dark); }

/* Featured project: the only deliberately large visual on the portal. */
.featured { padding-top:clamp(3rem, 7vw, 5.5rem); padding-bottom:clamp(3.5rem, 7vw, 6rem); }
.featured-visual { width:min(100%, 1400px); margin:0 auto; }
.featured-visual img { width:100%; height:auto; display:block; }
.featured-info { padding-top:clamp(2.5rem, 5vw, 4.5rem); }
.featured-info__inner { max-width:680px; }
.featured-info__label,.works-info__number { display:block; font-size:0.85rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--c-cyan); margin-bottom:.8rem; }
.featured-info__title { font-family:var(--f-brand); font-size:clamp(2rem, 5vw, 3.5rem); font-weight:300; line-height:1.2; margin-bottom:1rem; }
.featured-info__desc { color:var(--c-gray); font-size:1.0rem; line-height:2; margin-bottom:1.25rem; }
.featured-info__meta,.works-info__meta { display:flex; flex-wrap:wrap; gap:1rem; color:var(--c-gray); font-size:0.85rem; margin-bottom:1.5rem; }
.featured-info__actions,.works-info__actions { display:flex; flex-wrap:wrap; gap:.75rem; }

/* Works stay as compact banner rows rather than viewport-height scenes. */
.works-home .section-header { margin-bottom:1.5rem; }
.works-row { display:grid; grid-template-columns:minmax(0, 1.12fr) minmax(280px, .88fr); align-items:stretch; overflow:hidden; }
.works-row + .works-row { margin-top:1rem; }
.works-visual { min-width:0; aspect-ratio:16 / 9; overflow:hidden; }
.works-visual a,.works-visual img { display:block; width:100%; height:100%; }
.works-visual img { object-fit:cover; transition:transform var(--dur) var(--ease); }
.works-visual a:hover { opacity:1; }
.works-visual a:hover img { transform:scale(1.025); }
.works-info { display:flex; flex-direction:column; justify-content:center; padding:clamp(1.6rem, 4vw, 3rem); }
.works-info__title { font-family:var(--f-ui); font-size:clamp(1.7rem, 3.2vw, 2.7rem); font-weight:500; line-height:1.2; margin-bottom:1rem; }
.works-info__desc { max-width:520px; font-size:0.94rem; line-height:1.9; margin-bottom:1.25rem; }
.works-info__actions { margin-top:auto; }
.works-row--jtd { background:var(--c-jtd); color:var(--c-white); }
.works-row--jtd .works-info__number { color:var(--c-jtd-accent); }
.works-row--jtd .works-info__desc { color:rgba(255,255,255,.72); }
.works-row--jtd .works-info__meta { color:rgba(255,255,255,.52); }
.works-row--bonten { background:var(--c-bonten); color:var(--c-bonten-text); }
.works-row--bonten .works-info__number { color:var(--c-bonten-accent); }
.works-row--bonten .works-info__desc { color:rgba(24,37,42,.72); }
.works-row--bonten .works-info__meta { color:rgba(24,37,42,.52); }
.works-row--atoner { background:var(--c-deep); color:var(--c-white); }
.works-row--atoner .works-info__number { color:var(--c-cyan); }
.works-row--atoner .works-info__desc { color:var(--c-gray); }
.works-visual--required { display:flex; align-items:center; justify-content:center; background:#151820; color:var(--c-gray); text-align:center; font-size:0.85rem; font-weight:700; letter-spacing:.14em; line-height:1.8; }

/* About uses one image-led split instead of another standalone visual section. */
.about-teaser { display:grid; grid-template-columns:minmax(260px, .8fr) minmax(0, 1.2fr); gap:clamp(2.5rem, 6vw, 6rem); align-items:center; }
.about-teaser__text p { color:var(--c-gray-dark); font-size:0.98rem; line-height:2; margin-bottom:1.25rem; }
.about-teaser__highlight { color:var(--c-black)!important; font-family:var(--f-brand); font-size:clamp(1.45rem, 3vw, 2rem)!important; line-height:1.4!important; padding-left:1rem; border-left:2px solid var(--c-cyan); }
.about-teaser__media { display:grid; grid-template-columns:minmax(0, 1.6fr) minmax(90px, .7fr); gap:.5rem; }
.about-teaser__media > picture { min-width:0; }
.about-teaser__media > picture img { width:100%; height:100%; object-fit:cover; aspect-ratio:16 / 10; }
.about-teaser__thumbs { display:grid; grid-template-rows:1fr 1fr; gap:.5rem; min-width:0; }
.about-teaser__thumbs img { width:100%; height:100%; object-fit:cover; min-height:0; }
.about-teaser__stats { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:1rem; margin-top:2.5rem; }

/* Music keeps the existing feed, with a clear place for the real jacket asset. */
.music-release { display:grid; grid-template-columns:minmax(220px, .8fr) minmax(0, 1.2fr); gap:clamp(2rem, 6vw, 5rem); align-items:center; margin-bottom:2.5rem; }
.music-release__art { aspect-ratio:1; overflow:hidden; background:#171522; }
.music-release__art img { width:100%; height:100%; object-fit:cover; }
.music-release__art--required { display:flex; align-items:center; justify-content:center; color:var(--c-gray); border:1px dashed rgba(255,255,255,.25); text-align:center; font-size:0.85rem; font-weight:700; letter-spacing:.12em; line-height:1.8; }
.music-release__info { display:flex; flex-direction:column; align-items:flex-start; gap:.8rem; }
.music-release__type { color:var(--c-cyan); font-size:0.85rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.music-release__title { font-family:var(--f-brand); font-size:clamp(1.5rem, 3.5vw, 2.5rem); font-weight:300; line-height:1.3; }
.music-release__desc { color:var(--c-gray); font-size:0.95rem; }

/* Media feed is readable on both the light homepage and the dark archive variant. */
.media-list .media-item { color:var(--c-black); border-color:var(--c-gray-light); }
.media-list .media-item:first-child { border-color:var(--c-gray-light); }
.media-list .media-item__source { color:var(--c-indigo); }
.media-list .media-item__desc { color:var(--c-gray-dark); }
.section--black .media-list .media-item,.section--music .media-list .media-item { color:var(--c-white); border-color:rgba(255,255,255,.1); }
.section--black .media-list .media-item:first-child,.section--music .media-list .media-item:first-child { border-color:rgba(255,255,255,.1); }
.section--black .media-list .media-item__source,.section--music .media-list .media-item__source { color:var(--c-cyan); }

/* Shared footer restored for every existing page. */
.site-footer { background:var(--c-black); color:var(--c-white); padding:clamp(3.5rem, 7vw, 6rem) 0 1.5rem; }
.footer-grid { display:grid; grid-template-columns:minmax(190px, 1.3fr) repeat(4, minmax(0, 1fr)); gap:2.5rem 1.5rem; padding-bottom:3.5rem; }
.footer-brand img { width:120px; height:auto; margin-bottom:1.25rem; filter:brightness(0) invert(1); }
.footer-brand p { max-width:230px; color:var(--c-gray); font-size:0.85rem; line-height:1.8; }
.footer-col h4 { color:var(--c-cyan); font-size:0.85rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; margin-bottom:1rem; }
.footer-col ul { display:flex; flex-direction:column; gap:.45rem; }
.footer-col a { color:var(--c-gray); font-size:0.85rem; line-height:1.5; }
.footer-col a:hover { color:var(--c-white); opacity:1; }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-top:1.25rem; border-top:1px solid rgba(255,255,255,.12); }
.footer-sns { display:flex; align-items:center; gap:1rem; }
.footer-sns a { display:flex; color:var(--c-gray); }
.footer-sns a:hover { color:var(--c-white); opacity:1; }
.footer-copy { color:var(--c-gray); font-size:0.85rem; letter-spacing:.04em; }

@media (max-width: 768px) {
  .section-header { align-items:flex-start; flex-direction:column; gap:.75rem; margin-bottom:1.75rem; }
  .works-row { grid-template-columns:1fr; }
  .works-info { min-height:0; }
  .about-teaser,.music-release { grid-template-columns:1fr; gap:2rem; }
  .about-teaser__media { grid-template-columns:minmax(0, 1.6fr) minmax(84px, .7fr); }
  .music-release__art { max-width:420px; width:100%; }
  .footer-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:2rem 1.25rem; }
  .footer-brand { grid-column:1 / -1; }
  .footer-bottom { align-items:flex-start; flex-direction:column; }
}

@media (max-width: 640px) {
  .news-latest .news-item { grid-template-columns:1fr; gap:.3rem; padding:1rem 0; }
  .about-teaser__media { grid-template-columns:1fr; }
  .about-teaser__thumbs { grid-template-columns:1fr 1fr; grid-template-rows:none; }
  .about-teaser__thumbs img { aspect-ratio:1; }
  .about-teaser__stats { gap:.5rem; }
  .works-info__meta { gap:.55rem .8rem; }
}

/* ============================================================
   Homepage refinement
   Content-led differences, scoped so subpages keep their current system.
   ============================================================ */
.home-page {
  --home-ui: 'Zen Kaku Gothic New', var(--f-ui);
  --home-story: 'Noto Serif JP', 'Yu Mincho', serif;
}
.home-page .section-title,
.home-page .hero-brand-label,
.home-page .featured-info__label,
.home-page .works-info__number,
.home-page .music-release__type,
.home-page .media-item__source {
  font-family:var(--home-ui);
}
.home-page .hero-tagline,
.home-page .featured-info__title,
.home-page .about-teaser__highlight {
  font-family:var(--home-story);
  font-style:normal;
}
.home-page .works-info__title,
.home-page .music-release__title {
  font-family:var(--home-ui);
  font-weight:500;
  letter-spacing:-.025em;
}
.home-page .featured-info__label,
.home-page .works-info__number {
  font-size:0.85rem;
  letter-spacing:.12em;
}
.home-page #news { padding-block:clamp(3.5rem, 6vw, 5rem); }
.home-page .featured { padding-block:clamp(4.5rem, 8vw, 7rem); }
.home-page .works-home { padding-block:clamp(4rem, 6vw, 5.5rem); }
.home-page .about-teaser__media > picture img { aspect-ratio:3 / 2; }
.home-page .about-teaser__thumbs img { aspect-ratio:4 / 3; object-fit:cover; }
.home-page .section--music { background:var(--c-black); }
.home-page .section--alt { background:var(--c-white); border-top:1px solid var(--c-gray-light); }
.home-page .music-release__art a,
.home-page .music-release__art a:hover { display:block; height:100%; opacity:1; }
.home-page .music-release__art img { transition:transform var(--dur) var(--ease); }
.home-page .music-release__art a:hover img { transform:scale(1.025); }
.home-page .works-row--image-right { grid-template-columns:minmax(280px, .88fr) minmax(0, 1.12fr); }
.home-page .works-row--atoner { background:var(--c-black); color:var(--c-white); }
.home-page .works-row--atoner .works-info { min-height:220px; }
.home-page .works-row--atoner .works-info__number { color:var(--c-cyan); }
.home-page .works-row--atoner .works-info__desc { color:var(--c-gray); }
.home-page .cta-section--compact { padding-block:clamp(3rem, 5vw, 4rem); }
.home-page .cta-section--compact .section-title { margin-bottom:.6rem; }

.about-page-photo { max-width:1000px; margin:clamp(2.5rem, 6vw, 5rem) auto 0; }
.about-page-photo img { width:100%; aspect-ratio:3 / 2; object-fit:cover; }
.about-page-photo figcaption { margin-top:.7rem; color:var(--c-gray-dark); font-size:0.85rem; line-height:1.7; }
.works-teaser-mark {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:220px;
  padding:1.5rem;
  color:transparent;
  background:#11131a;
  font-family:var(--f-ui);
  font-size:clamp(3rem, 8vw, 7rem);
  font-weight:700;
  letter-spacing:-.08em;
  line-height:1;
  -webkit-text-stroke:1px rgba(245,246,247,.58);
}

@media (max-width: 768px) {
  .home-page .works-row--image-right { grid-template-columns:1fr; }
  .home-page .works-row--image-right .works-info { order:1; }
  .home-page .works-row--image-right .works-visual { order:2; }
  .works-row--atoner .works-info,
  .works-row--atoner .works-teaser-mark { min-height:170px; }
}

/* ============================================================
   Corporate white pass
   Keep the existing portal structure; quiet the UI around the work.
   ============================================================ */
.home-page .section-title,
.home-page .featured-info__title,
.home-page .works-info__title,
.home-page .music-release__title {
  font-family:var(--home-story);
  font-weight:500;
  font-style:normal;
}
.home-page .section-title { font-size:clamp(1.65rem, 3vw, 2.25rem); letter-spacing:-.02em; }
.home-page .hero-tagline { font-family:var(--home-story); font-size:clamp(3rem, 5vw, 4.5rem); font-weight:500; }
.home-page .featured-info__title { font-size:clamp(2rem, 4vw, 3rem); }
.home-page .works-info__title { font-size:clamp(1.5rem, 2.8vw, 2.15rem); }
.home-page .music-release__title { font-size:clamp(1.45rem, 2.8vw, 2.15rem); }

.home-page #news { padding-block:clamp(3.5rem, 5vw, 4.5rem); }
.home-page #news .container { max-width:1100px; }
.home-page .featured { padding-block:clamp(5rem, 8vw, 7.5rem); background:var(--c-white); color:var(--c-black); }
.home-page .featured-info { max-width:1040px; }
.home-page .featured-info__desc { color:var(--c-gray-dark); }
.home-page .featured-info__meta { color:var(--c-gray-dark); }
.home-page .featured-info__label { color:var(--c-gray-dark); }
.home-page .featured-info .btn--white { border-color:var(--c-black); color:var(--c-black); }
.home-page .featured-info .btn--white:hover { background:var(--c-black); color:var(--c-white); }
.home-page .featured-info .btn--booth { border-color:var(--c-gray-dark); color:var(--c-gray-dark); }
.home-page .featured-info .btn--booth:hover { background:var(--c-gray-dark); color:var(--c-white); }

.home-page .works-home { padding-block:clamp(4.5rem, 6vw, 5.5rem); }
.home-page .works-home .container { max-width:1240px; }
.home-page .works-row--jtd,
.home-page .works-row--bonten,
.home-page .works-row--atoner {
  background:var(--c-white);
  color:var(--c-black);
  border:1px solid var(--c-gray-light);
}
.home-page .works-row--jtd .works-info__number,
.home-page .works-row--bonten .works-info__number,
.home-page .works-row--atoner .works-info__number { color:var(--c-gray-dark); }
.home-page .works-row--jtd .works-info__desc,
.home-page .works-row--bonten .works-info__desc,
.home-page .works-row--atoner .works-info__desc { color:var(--c-gray-dark); }
.home-page .works-row--jtd .works-info__meta,
.home-page .works-row--bonten .works-info__meta,
.home-page .works-row--atoner .works-info__meta { color:var(--c-gray-dark); }
.home-page .works-row .btn--white { border-color:var(--c-black); color:var(--c-black); }
.home-page .works-row .btn--white:hover { background:var(--c-black); color:var(--c-white); }
.home-page .works-row--atoner .works-teaser-mark { background:var(--c-black); }

.home-page #about { padding-block:clamp(6rem, 9vw, 8.5rem); }
.home-page #about .container { max-width:1360px; }
.home-page .about-teaser { grid-template-columns:minmax(280px, .75fr) minmax(0, 1.25fr); gap:clamp(3rem, 7vw, 7rem); }
.home-page .about-teaser__media { display:block; }
.home-page .about-teaser__media > picture img { aspect-ratio:3 / 2; width:100%; object-fit:cover; }
.home-page .about-teaser__highlight { font-weight:500!important; }

.home-page .section--music { padding-block:clamp(4.5rem, 6vw, 5.5rem); background:var(--c-white); color:var(--c-black); }
.home-page .section--music .section-title { color:var(--c-black); }
.home-page .section--music .link-arrow--white { color:var(--c-gray-dark); }
.home-page .section--music .link-arrow--white:hover { color:var(--c-black); }
.home-page .section--music .music-release__type { color:var(--c-gray-dark); }
.home-page .section--music .music-release__desc { color:var(--c-gray-dark); }
.home-page .section--music .btn--white { border-color:var(--c-black); color:var(--c-black); }
.home-page .section--music .btn--white:hover { background:var(--c-black); color:var(--c-white); }
.home-page .section--music .music-releases { color:var(--c-black); }

.home-page #media { padding-block:clamp(4rem, 6vw, 5.5rem); }
.home-page #media .container { max-width:1180px; }
.home-page .cta-section--compact { padding-block:clamp(3rem, 4vw, 4rem); background:var(--c-white); border-top:1px solid var(--c-gray-light); }

@media (max-width: 768px) {
  .home-page #about { padding-block:clamp(4.5rem, 14vw, 6rem); }
  .home-page .about-teaser { grid-template-columns:1fr; gap:2.5rem; }
}

/* The Works archive uses the same quiet catalogue surface as the homepage. */
.works-page .works-row--jtd,
.works-page .works-row--bonten,
.works-page .works-row--atoner {
  background:var(--c-white);
  color:var(--c-black);
  border:1px solid var(--c-gray-light);
}
.works-page .works-row--jtd .works-info__number,
.works-page .works-row--bonten .works-info__number,
.works-page .works-row--atoner .works-info__number,
.works-page .works-row--jtd .works-info__desc,
.works-page .works-row--bonten .works-info__desc,
.works-page .works-row--atoner .works-info__desc,
.works-page .works-row--jtd .works-info__meta,
.works-page .works-row--bonten .works-info__meta,
.works-page .works-row--atoner .works-info__meta { color:var(--c-gray-dark); }
.works-page .btn--white { border-color:var(--c-black); color:var(--c-black); }
.works-page .btn--white:hover { background:var(--c-black); color:var(--c-white); }
.works-page .works-row--atoner .works-teaser-mark { background:var(--c-black); }

/* Editorial hierarchy: statement first, evidence next, updates last. */
.home-page main { display:flex; flex-direction:column; align-items:stretch; }
.home-page main > section { width:100%; }
.home-page .hero { order:1; }
.home-page #featured { display:none; }
.home-page #news { order:2; }
.home-page #works { order:3; }
.home-page #about { order:4; }
.home-page #gallery { order:5; }
.home-page #music { order:6; }
.home-page #media { order:7; }
.home-page #contact { display:none; }

/* Final editorial rhythm: fewer hero-scale surfaces, more breathing room. */
.home-page #news { padding-block:clamp(5rem, 7vw, 6.5rem); }
.home-page #about { padding-block:clamp(7rem, 10vw, 10rem); }
.home-page #works { padding-block:clamp(6rem, 8vw, 8rem); }
.home-page #music { padding-block:clamp(6rem, 8vw, 8rem); }
.home-page #gallery { padding-block:clamp(5.5rem, 7vw, 7rem); }
.home-page #media { padding-block:clamp(5.5rem, 7vw, 7rem); }
.home-history { margin-top:clamp(4rem, 7vw, 6rem); padding-top:1.5rem; border-top:1px solid var(--c-gray-light); }
.home-history__heading { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; margin-bottom:1.25rem; }
.home-history__heading > span { color:var(--c-gray-dark); font-family:var(--f-ui); font-size:0.85rem; font-weight:500; letter-spacing:.12em; }
.home-history__list { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:1rem; }
.home-history__list div { display:flex; flex-direction:column; gap:.35rem; padding-right:1rem; border-right:1px solid var(--c-gray-light); }
.home-history__list div:last-child { border-right:0; }
.home-history__list time { color:var(--c-gray-dark); font-family:var(--f-ui); font-size:0.85rem; font-variant-numeric:tabular-nums; }
.home-history__list span { font-family:var(--f-brand); font-size:1.05rem; line-height:1.6; }
.home-gallery__grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:1rem; }
.home-gallery__grid a { display:block; overflow:hidden; }
.home-gallery__grid img { width:100%; aspect-ratio:1; object-fit:cover; transition:transform var(--dur) var(--ease); }
.home-gallery__grid a:hover { opacity:1; }
.home-gallery__grid a:hover img { transform:scale(1.02); }
.home-page .products-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:clamp(2.5rem, 6vw, 5.5rem); }
.home-page .product-card { display:flex; flex-direction:column; min-width:0; }
.home-page .product-card__visual { display:block; overflow:hidden; aspect-ratio:16 / 10; border:1px solid var(--c-gray-light); }
.home-page .product-card__visual:hover { opacity:1; }
.home-page .product-card__visual img { width:100%; height:100%; object-fit:cover; transition:transform var(--dur) var(--ease); }
.home-page .product-card__visual:hover img { transform:scale(1.02); }
.home-page .product-card__info { padding-top:1.5rem; }
.home-page .product-card__title { margin-bottom:.8rem; font-family:var(--f-brand); font-size:clamp(1.45rem, 2.5vw, 2rem); font-weight:500; line-height:1.35; }
.home-page .product-card__desc { max-width:520px; color:var(--c-gray-dark); font-size:0.95rem; line-height:1.9; }
.home-page .product-card__subtitle { display:block; color:var(--c-black); font-family:var(--f-brand); font-size:1.08rem; line-height:1.7; margin-bottom:.3rem; }
.home-page .product-card__actions { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.25rem; }
.home-page .product-card__actions .btn { font-size:0.85rem; padding:.55rem .9rem; }
.home-page .music-intro { margin-top:-1rem; margin-bottom:2rem; color:var(--c-gray-dark); font-size:1.0rem; }
.home-page .music-releases { display:flex; flex-direction:column; gap:0; max-width:820px; }
.home-page .music-card { display:grid; grid-template-columns:100px minmax(0, 1fr); column-gap:1rem; align-items:baseline; padding:1rem 0; border:0; border-top:1px solid var(--c-gray-light); color:var(--c-black); }
.home-page .music-card:last-child { border-bottom:1px solid var(--c-gray-light); }
.home-page .music-card__type { grid-column:1; color:var(--c-gray-dark); font-size:0.85rem; letter-spacing:.08em; }
.home-page .music-card__title { grid-column:2; color:var(--c-black); font-size:1.02rem; }
.home-page .music-card__date { grid-column:1; color:var(--c-gray-dark); font-size:0.85rem; }
.home-page .music-card__desc { grid-column:2; color:var(--c-gray-dark); font-size:0.86rem; }
.home-page .music-card .link-arrow { grid-column:2; margin-top:.35rem; }

@media (max-width: 768px) {
  .home-history__heading { align-items:flex-start; flex-direction:column; }
  .home-history__list { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:1.5rem 1rem; }
  .home-history__list div:nth-child(2) { border-right:0; }
  .home-gallery__grid { gap:.5rem; }
  .home-page .products-grid { grid-template-columns:1fr; gap:3.5rem; }
}

@media (max-width: 480px) {
  .home-history { margin-top:3rem; }
  .home-history__list { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:0; }
  .home-history__list div { min-height:88px; padding:.8rem .75rem .8rem 0; border-top:1px solid var(--c-gray-light); border-right:0; }
  .home-history__list div:nth-child(odd) { border-right:1px solid var(--c-gray-light); padding-right:.75rem; }
  .home-history__list span { font-size:0.92rem; line-height:1.5; }
  .home-page .music-card { grid-template-columns:78px minmax(0, 1fr); column-gap:.75rem; padding:.85rem 0; }
  .home-page .music-card__title { font-size:0.94rem; }
  .home-page .music-card__desc { font-size:0.85rem; line-height:1.6; }
}

/* Media cards: official MUGnet imagery carries the colour, source favicon identifies the outlet. */
.media-list--cards { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:1.25rem; max-width:none; }
.media-list--cards .media-item--card { display:flex; flex-direction:column; min-width:0; padding:0; color:var(--c-black); border:1px solid var(--c-gray-light); background:var(--c-white); transition:border-color var(--dur-fast) var(--ease); }
.media-list--cards .media-item--card:first-child { border-top:1px solid var(--c-gray-light); }
.media-list--cards .media-item--card:hover { opacity:1; border-color:var(--c-gray-dark); }
.media-item__thumb { aspect-ratio:16 / 9; overflow:hidden; background:var(--c-gray-light); }
.media-item__thumb img { width:100%; height:100%; object-fit:cover; transition:transform var(--dur) var(--ease); }
.media-item--card:hover .media-item__thumb img { transform:scale(1.025); }
.media-item__body { display:flex; flex:1; flex-direction:column; padding:1.15rem 1.2rem 1.3rem; }
.media-item__heading { display:flex; align-items:center; gap:.45rem; min-height:1.25rem; margin-bottom:.65rem; }
.media-item__favicon { width:16px; height:16px; object-fit:contain; flex:0 0 16px; }
.media-list--cards .media-item__source { color:var(--c-gray-dark); font-size:0.85rem; letter-spacing:.08em; }
.media-list--cards .media-item__title { color:var(--c-black); font-size:1.05rem; line-height:1.6; }
.media-list--cards .media-item__desc { margin-top:auto; padding-top:1rem; color:var(--c-gray-dark); font-size:0.85rem; line-height:1.5; }

@media (max-width: 768px) {
  .media-list--cards { grid-template-columns:1fr; gap:1rem; }
  .media-list--cards .media-item--card { display:grid; grid-template-columns:112px minmax(0, 1fr); }
  .media-item__thumb { height:100%; min-height:112px; aspect-ratio:auto; }
  .media-item__body { padding:.85rem .9rem .9rem; }
  .media-list--cards .media-item__title { font-size:0.94rem; line-height:1.5; }
  .media-list--cards .media-item__desc { padding-top:.65rem; font-size:0.85rem; }
}

/* Works archive follows the homepage product catalogue. */
.works-page .products-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:clamp(2.5rem, 6vw, 5.5rem); }
.works-page .product-card { display:flex; flex-direction:column; min-width:0; }
.works-page .product-card__visual { display:block; overflow:hidden; aspect-ratio:16 / 10; border:1px solid var(--c-gray-light); }
.works-page .product-card__visual:hover { opacity:1; }
.works-page .product-card__visual img { width:100%; height:100%; object-fit:cover; transition:transform var(--dur) var(--ease); }
.works-page .product-card__visual:hover img { transform:scale(1.02); }
.works-page .product-card__info { padding-top:1.5rem; }
.works-page .product-card__title { margin-bottom:.8rem; font-family:var(--f-brand); font-size:clamp(1.45rem, 2.5vw, 2rem); font-weight:500; line-height:1.35; }
.works-page .product-card__desc { max-width:520px; color:var(--c-gray-dark); font-size:0.95rem; line-height:1.9; }
.works-page .product-card__subtitle { display:block; color:var(--c-black); font-family:var(--f-brand); font-size:1.08rem; line-height:1.7; margin-bottom:.3rem; }
.works-page .product-card__actions { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.25rem; }
.works-page .product-card__actions .btn { font-size:0.85rem; padding:.55rem .9rem; }

@media (max-width: 768px) {
  .works-page .products-grid { grid-template-columns:1fr; gap:3.5rem; }
}

/* Mobile menu refinement: a quiet, readable corporate panel instead of a centred overlay. */
@media (max-width: 768px) {
  .site-header.menu-open { background:var(--c-white); box-shadow:0 1px 0 var(--c-gray-light); }
  .site-header.menu-open .hamburger span { background:var(--c-black); }
  .nav-mobile {
    inset:0;
    align-items:stretch;
    justify-content:flex-start;
    gap:0;
    padding:calc(var(--header-h) + 3.5rem) clamp(1.5rem, 8vw, 3rem) 2rem;
    background:var(--c-white);
    color:var(--c-black);
    overflow-y:auto;
  }
  .nav-mobile::before {
    content:'MUGnet  /  MENU';
    position:absolute;
    top:calc(var(--header-h) + 1.25rem);
    left:clamp(1.5rem, 8vw, 3rem);
    color:var(--c-gray-dark);
    font-family:var(--f-ui);
    font-size:0.85rem;
    font-weight:500;
    letter-spacing:.16em;
  }
  .nav-mobile a,
  .nav-mobile.open a {
    width:100%;
    max-width:420px;
    padding:.85rem 0;
    border-top:1px solid var(--c-gray-light);
    color:var(--c-black);
    font-family:var(--f-ui);
    font-size:clamp(1.05rem, 4vw, 1.35rem);
    font-weight:500;
    letter-spacing:.04em;
    text-align:left;
    opacity:0;
    transform:translateX(-12px);
  }
  .nav-mobile a:last-child { border-bottom:1px solid var(--c-gray-light); }
  .nav-mobile.open a { opacity:1; transform:translateX(0); }
  .nav-mobile a:hover { color:var(--c-gray-dark); opacity:1; }
}

/* Expanded individual-page information blocks. */
.music-details__grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(3rem, 7vw, 7rem); }
.music-details .section-title { margin-bottom:1.5rem; }
.music-history-list { border-top:1px solid var(--c-gray-light); }
.music-history-list > div { display:grid; grid-template-columns:110px minmax(0,1fr); gap:1rem; padding:1rem 0; border-bottom:1px solid var(--c-gray-light); }
.music-history-list time { color:var(--c-gray-dark); font-size:0.85rem; }
.music-history-list span { font-family:var(--f-brand); font-size:1.05rem; line-height:1.7; }
.music-creators { display:flex; flex-direction:column; border-top:1px solid var(--c-gray-light); }
.music-creators a { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--c-gray-light); }
.music-creators strong { font-family:var(--f-brand); font-size:1rem; font-weight:500; }
.music-creators span { color:var(--c-gray-dark); font-size:0.85rem; }
.music-distribution { margin-top:clamp(3rem, 6vw, 5rem); padding-top:1.5rem; border-top:1px solid var(--c-gray-light); }
.music-distribution p { color:var(--c-gray-dark); font-size:0.95rem; }
.link-cluster { display:flex; flex-wrap:wrap; gap:.75rem 1.25rem; margin-top:1.25rem; }
.link-cluster a { color:var(--c-gray-dark); font-size:0.85rem; text-decoration:underline; text-underline-offset:3px; }
.presskit-boilerplate { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1.5rem; }
.presskit-boilerplate > div { padding:1.25rem; border:1px solid var(--c-gray-light); }
.presskit-boilerplate span { color:var(--c-gray-dark); font-size:0.85rem; letter-spacing:.1em; }
.presskit-boilerplate p { margin-top:.85rem; font-size:0.92rem; line-height:1.9; }
.presskit-reference-grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1rem; }
.presskit-reference-grid a { display:flex; flex-direction:column; gap:.45rem; padding:1.25rem; border:1px solid var(--c-gray-light); }
.presskit-reference-grid a:hover { border-color:var(--c-gray-dark); opacity:1; }
.presskit-reference-grid strong { font-family:var(--f-brand); font-size:1rem; font-weight:500; }
.presskit-reference-grid span { color:var(--c-gray-dark); font-size:0.85rem; line-height:1.6; }
.support-links { display:flex; flex-wrap:wrap; gap:1rem 1.5rem; margin-top:2rem; padding-top:1.25rem; border-top:1px solid var(--c-gray-light); }
.support-links a { color:var(--c-gray-dark); font-size:0.88rem; text-decoration:underline; text-underline-offset:3px; }

/* Media section separation: Coverage vs Press Releases */
.media-section { margin-bottom:clamp(3rem, 6vw, 5rem); }
.media-section:last-child { margin-bottom:0; }
.media-section__desc { color:var(--c-gray-dark); font-size:0.95rem; margin-bottom:1.5rem; }

/* Gallery category filters */
.gallery-filters { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:2rem; }
.gallery-filter {
  padding:.5rem 1.2rem; font-size:0.85rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase;
  border:1px solid var(--c-gray-light); background:transparent; color:var(--c-gray-dark);
  cursor:pointer; transition:all var(--dur-fast) var(--ease);
}
.gallery-filter:hover { border-color:var(--c-black); color:var(--c-black); }
.gallery-filter.active { background:var(--c-black); color:var(--c-white); border-color:var(--c-black); }

/* Press Kit assets grid */
.presskit-assets { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr)); gap:1.25rem; }
.presskit-asset { display:flex; align-items:center; gap:1rem; padding:1.25rem; border:1px solid var(--c-gray-light); transition:border-color var(--dur-fast); }
.presskit-asset:hover { border-color:var(--c-gray-dark); }
.presskit-asset__preview { flex-shrink:0; width:64px; height:64px; display:flex; align-items:center; justify-content:center; background:var(--c-gray-light); overflow:hidden; }
.presskit-asset__preview img { max-width:100%; max-height:100%; object-fit:contain; }
.presskit-asset__info h3 { font-size:0.98rem; font-weight:500; margin-bottom:.2rem; }
.presskit-asset__info p { font-size:0.85rem; color:var(--c-gray-dark); }

/* Support topic cards */
.support-topics { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr)); gap:1px; background:var(--c-gray-light); }
.support-topic { display:flex; align-items:center; gap:1rem; padding:1.5rem 1.75rem; background:var(--c-white); transition:background var(--dur-fast); }
.support-topic:hover { background:var(--c-gray-light); opacity:1; }
.support-topic__icon { flex-shrink:0; width:40px; height:40px; display:flex; align-items:center; justify-content:center; background:var(--c-black); color:var(--c-white); font-family:var(--f-brand); font-size:1.0rem; font-weight:500; }
.support-topic h3 { font-size:1.05rem; font-weight:500; margin-bottom:.2rem; }
.support-topic p { font-size:0.88rem; color:var(--c-gray-dark); line-height:1.6; }

/* Works fact sheet */
.works-fact-sheet { margin-top:1rem; }
.works-fact-sheet table { width:100%; border-collapse:collapse; font-size:0.92rem; }
.works-fact-sheet td { padding:.55rem 0; border-bottom:1px solid var(--c-gray-light); vertical-align:top; }
.works-fact-sheet td:first-child { font-weight:500; color:var(--c-gray-dark); width:100px; }
.works-fact-sheet td:last-child { color:var(--c-black); }

/* Music tracklist */
.music-tracklist__table { border-top:1px solid var(--c-gray-light); }
.music-track { display:grid; grid-template-columns:40px 1fr auto; gap:1rem; padding:.85rem 0; border-bottom:1px solid var(--c-gray-light); font-size:0.98rem; align-items:baseline; }
.music-track__num { color:var(--c-gray); font-size:0.85rem; font-variant-numeric:tabular-nums; }
.music-track__title { font-family:var(--f-brand); font-weight:400; }
.music-track__composer { color:var(--c-gray-dark); font-size:0.88rem; text-align:right; }
.music-platforms { display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin-top:1.5rem; margin-bottom:1.5rem; }
.music-platforms h3 { font-size:0.85rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--c-gray-dark); margin-bottom:.75rem; }
.music-platforms .link-cluster span { color:var(--c-gray-dark); font-size:0.88rem; }
@media(max-width:640px){.music-track{grid-template-columns:32px 1fr;}.music-track__composer{grid-column:1/-1;text-align:left;font-size:0.85rem;margin-top:.2rem;}.music-platforms{grid-template-columns:1fr;}}

/* Works full credits (accordion) */
.works-full-credits { margin-top:1.25rem; border:1px solid var(--c-gray-light); }
.works-full-credits summary { padding:.85rem 1.25rem; font-size:0.85rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--c-gray-dark); cursor:pointer; transition:color var(--dur-fast); }
.works-full-credits summary:hover { color:var(--c-black); }
.works-full-credits[open] summary { border-bottom:1px solid var(--c-gray-light); }
.works-credit-list { padding:1rem 1.25rem; }
.works-credit-row { display:grid; grid-template-columns:140px 1fr; gap:1rem; padding:.45rem 0; border-bottom:1px solid var(--c-gray-light); font-size:0.92rem; }
.works-credit-row:last-child { border-bottom:0; }
.works-credit-role { color:var(--c-gray-dark); }
.works-credit-people { color:var(--c-black); }
.works-credit-note { display:block; font-size:0.85rem; color:var(--c-gray); margin-top:.15rem; }
@media(max-width:640px){.works-credit-row{grid-template-columns:1fr;gap:.2rem;}}

/* Media thumb empty state */
.media-item__thumb--empty { display:flex; align-items:center; justify-content:center; background:var(--c-gray-light); color:var(--c-gray); font-size:0.85rem; font-weight:500; letter-spacing:.1em; }

/* Media summary */
.media-item__summary { font-size:0.88rem; color:var(--c-gray-dark); line-height:1.7; margin-top:.6rem; }

/* Media favicon */
.media-item__favicon { width:16px; height:16px; object-fit:contain; flex:0 0 16px; }

/* ---- Support Hub ---- */
.support-quick-nav { display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; }
.support-quick-item {
  font-size:0.92rem; color:var(--c-gray-dark); text-decoration:none;
  padding:.4rem 0; border-bottom:1px solid transparent;
  transition:border-color var(--dur-fast), color var(--dur-fast);
}
.support-quick-item:hover { color:var(--c-black); border-bottom-color:var(--c-black); opacity:1; }

.support-work { border:1px solid var(--c-gray-light); margin-bottom:1px; }
.support-work + .support-work { margin-top:-1px; }
.support-work__header {
  display:flex; align-items:baseline; gap:1rem; padding:1.25rem 1.5rem;
  cursor:pointer; list-style:none; transition:background var(--dur-fast);
}
.support-work__header::-webkit-details-marker { display:none; }
.support-work__header::after { content:'\25BC'; font-size:0.85rem; color:var(--c-gray); margin-left:auto; transition:transform var(--dur-fast); }
.support-work[open] .support-work__header::after { transform:rotate(180deg); }
.support-work__header:hover { background:rgba(0,0,0,.02); }
.support-work__title { font-family:var(--f-brand); font-size:1.15rem; font-weight:500; }
.support-work__meta { font-size:0.85rem; color:var(--c-gray); }
.support-work__body { padding:0 1.5rem 1.5rem; }
.support-work__grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem 2.5rem; margin-bottom:1.25rem; }
.support-work__info h3 {
  font-family:var(--f-ui); font-size:0.85rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--c-gray-dark);
  margin-bottom:.6rem; padding-bottom:.4rem; border-bottom:1px solid var(--c-gray-light);
}
.support-work__note { font-size:0.88rem; color:var(--c-gray); line-height:1.7; margin-top:.5rem; }
.support-work__footer { padding-top:.75rem; border-top:1px solid var(--c-gray-light); }

.support-spec-table { width:100%; border-collapse:collapse; font-size:0.92rem; }
.support-spec-table td { padding:.35rem 0; vertical-align:top; }
.support-spec-table td:first-child { color:var(--c-gray-dark); width:80px; font-size:0.88rem; }

.support-link-list { display:flex; flex-direction:column; gap:.35rem; }
.support-deep-link {
  font-size:0.92rem; color:var(--c-black); text-decoration:underline; text-underline-offset:3px;
  transition:color var(--dur-fast);
}
.support-deep-link:hover { color:var(--c-cyan); opacity:1; }
.support-deep-link--ext::after { content:' \2197'; font-size:0.85rem; }

.support-official-link { font-size:0.85rem; color:var(--c-gray-dark); text-decoration:underline; text-underline-offset:3px; }
.support-official-link:hover { color:var(--c-black); opacity:1; }

.support-faq {
  border-bottom:1px solid var(--c-gray-light); padding:1rem 0;
}
.support-faq summary {
  font-family:var(--f-brand); font-size:1.05rem; font-weight:400;
  cursor:pointer; list-style:none; padding-right:1.5rem; position:relative;
}
.support-faq summary::-webkit-details-marker { display:none; }
.support-faq summary::after { content:'\002B'; position:absolute; right:0; top:0; color:var(--c-gray); font-size:1.1rem; }
.support-faq[open] summary::after { content:'\2212'; }
.support-faq p { font-size:0.95rem; color:var(--c-gray-700); line-height:1.9; margin-top:.75rem; }
.support-faq p a { text-decoration:underline; text-underline-offset:3px; }

.support-contact-hint { display:flex; flex-wrap:wrap; gap:.5rem; }
.support-contact-hint span {
  font-size:0.85rem; color:var(--c-gray-dark); padding:.35rem .75rem;
  border:1px solid var(--c-gray-light);
}

@media(max-width:768px) {
  .support-work__grid { grid-template-columns:1fr; gap:1.25rem; }
  .support-quick-nav { gap:.3rem 1rem; }
}

@media (max-width: 768px) {
  .music-details__grid { grid-template-columns:1fr; gap:3rem; }
  .presskit-boilerplate,.presskit-reference-grid { grid-template-columns:1fr; }
  .music-history-list > div { grid-template-columns:90px minmax(0,1fr); }
}

.contact-category { width:100%; text-align:left; cursor:pointer; }
.contact-category:focus-visible { outline:2px solid var(--c-black); outline-offset:3px; }

/* Press kit: fill the available width and expose downloadable originals. */
.presskit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.presskit-assets { grid-template-columns:repeat(3,minmax(0,1fr)); }
.presskit-asset { flex-direction:column; align-items:stretch; min-width:0; }
.presskit-asset__preview { width:100%; height:150px; background:#e1e2e4; padding:1rem; }
.presskit-asset__preview img { width:100%; height:100%; object-fit:contain; }
.presskit-download { display:inline-block; margin-top:.8rem; text-decoration:underline; text-underline-offset:4px; font-size:0.9rem; }
@media(max-width:768px){.presskit-grid,.presskit-assets{grid-template-columns:1fr;}}

/* Mobile reading rhythm and full-width media previews. */
@media(max-width:768px){
.container{padding-inline:24px}.home-page .section-header{align-items:flex-start;gap:14px;flex-wrap:wrap}.home-page .section-header .link-arrow{line-height:1.6}.home-page .news-item{padding-block:24px!important;gap:12px!important}.home-page .news-content h3{line-height:1.75}.home-page .news-content p,.home-page .product-card p,.home-page .about-teaser p,.home-page .music-card__desc{line-height:1.9}.home-history__list{grid-template-columns:1fr!important;gap:0!important}.home-history__list div{padding:20px 0!important;border-right:0!important;min-height:auto!important}.home-page .music-card{grid-template-columns:100px minmax(0,1fr);gap:18px;padding-block:24px}.home-page .music-card__title{line-height:1.7}.support-work__body{padding:24px 18px}.support-faq{padding-block:20px}.support-faq p{line-height:1.9}.media-list--cards .media-item--card{display:flex;flex-direction:column;min-width:0}.media-item__thumb{width:100%;height:auto;min-height:0;aspect-ratio:16 / 9}.media-item__thumb img{object-fit:contain}.media-item__body{padding:22px}.media-list--cards .media-item__title{font-size:1rem;line-height:1.75}.media-item__summary{font-size:.95rem;line-height:1.9}.media-list--cards{gap:24px}
}