/* スライド */
    .hero-slide {
      opacity: 0;
      transition: opacity 900ms cubic-bezier(.4,0,.2,1), transform 8000ms linear;
      transform: scale(1.02);
    }
    .hero-slide[data-active="true"] {
      opacity: 1;
      transform: scale(1);
    }
    /* 右辺ドット (丸のまま。アクティブは少し大きく + リング) */
    .hero-dot { transition: transform .35s ease, background-color .35s ease, box-shadow .35s ease; }
    .hero-dot.is-active {
      transform: scale(1.9);
      box-shadow: 0 0 0 3px rgba(14,165,233,0.18);
    }
    /* ===== センターフラッシュ (全遮蔽 + ノイズグリッチ / 約3秒) ===== */
    #hero-flash { transition: none; }
    #hero-flash.is-flash { animation: hero-flash 2200ms cubic-bezier(.2,.7,.2,1) forwards; }
    @keyframes hero-flash {
      0%   { opacity: 0; }
      6%   { opacity: 1; }   /* 一気に遮蔽 (180ms) */
      86%  { opacity: 1; }   /* 3秒中の中盤〜終盤まで表示保持 */
      100% { opacity: 0; }   /* 最後の 420ms でノイズごとフェードアウト */
    }

    /* ノイズテクスチャ (SVG turbulence) */
    .hero-flash-noise {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.06  0 0 0 0 0.09  0 0 0 0 0.14  0 0 0 0.55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
      background-size: 240px 240px;
      mix-blend-mode: multiply;
      opacity: 0;
    }
    #hero-flash.is-flash .hero-flash-noise {
      animation: hero-noise-flicker 2200ms steps(1) forwards;
    }
    @keyframes hero-noise-flicker {
      0%   { opacity: 0;    background-position: 0 0; }
      6%   { opacity: 0.55; background-position: 30px 20px; }
      15%  { opacity: 0.35; background-position: -18px 40px; }
      22%  { opacity: 0.6;  background-position: 80px -20px; }
      35%  { opacity: 0.4;  background-position: -60px 15px; }
      50%  { opacity: 0.5;  background-position: 42px 70px; }
      65%  { opacity: 0.32; background-position: -30px -50px; }
      80%  { opacity: 0.45; background-position: 90px 30px; }
      95%  { opacity: 0.55; background-position: -10px 60px; }
      100% { opacity: 0; }
    }

    /* 走査線 (テレビ的なスキャンライン) */
    .hero-flash-scan {
      background: repeating-linear-gradient(
        to bottom,
        rgba(15,23,42,0.05) 0px,
        rgba(15,23,42,0.05) 1px,
        transparent 1px,
        transparent 3px
      );
      opacity: 0;
      transform: translateY(-100%);
    }
    #hero-flash.is-flash .hero-flash-scan {
      animation: hero-scan 2200ms linear forwards;
    }
    @keyframes hero-scan {
      0%   { opacity: 0;    transform: translateY(-30%); }
      10%  { opacity: 0.8; }
      100% { opacity: 0.4;  transform: translateY(20%); }
    }

    /* C-LAXIS 本体 + RGB スプリット (::before red / ::after cyan) */
    .hero-flash-text {
      position: relative;
      color: #0f172a;
      letter-spacing: -0.03em;
      line-height: 0.9;
    }
    .hero-flash-text::before,
    .hero-flash-text::after {
      content: attr(data-text);
      position: absolute;
      inset: 0;
      pointer-events: none;
    }
    .hero-flash-text::before { color: #ef4444; }   /* red */
    .hero-flash-text::after  { color: #06b6d4; }   /* cyan */
    #hero-flash.is-flash .hero-flash-text  { animation: hero-glitch-main  2200ms steps(1) forwards; }
    #hero-flash.is-flash .hero-flash-text::before { animation: hero-glitch-r 2200ms steps(1) forwards; }
    #hero-flash.is-flash .hero-flash-text::after  { animation: hero-glitch-c 2200ms steps(1) forwards; }

    @keyframes hero-glitch-main {
      0%   { opacity: 0; transform: scale(0.96); filter: blur(4px); }
      6%   { opacity: 1; transform: scale(1);    filter: blur(0); }
      10%  { clip-path: polygon(0 0, 100% 0, 100% 30%, 0 30%, 0 34%, 100% 34%, 100% 70%, 0 70%, 0 74%, 100% 74%, 100% 100%, 0 100%); }
      12%  { clip-path: none; }
      30%  { transform: translateX(-3px); }
      31%  { transform: translateX(3px); }
      32%  { transform: translateX(0); }
      60%  { transform: translateY(2px); }
      61%  { transform: translateY(0); }
      85%  { opacity: 1; filter: blur(0); }
      100% { opacity: 0; filter: blur(6px); transform: scale(1.02); }
    }
    @keyframes hero-glitch-r {
      0%,6%   { opacity: 0;   transform: translate(0,0); }
      8%     { opacity: 0.9; transform: translate(-4px, -2px); }
      15%    { transform: translate(2px, 1px); }
      22%    { opacity: 0.7; transform: translate(-6px, 0); }
      38%    { opacity: 0.9; transform: translate(3px, -1px); }
      55%    { opacity: 0.6; transform: translate(-2px, 2px); }
      75%    { opacity: 0.9; transform: translate(4px, 0); }
      90%    { opacity: 0.5; transform: translate(-3px, 1px); }
      100%   { opacity: 0;   transform: translate(0,0); }
    }
    @keyframes hero-glitch-c {
      0%,6%   { opacity: 0;   transform: translate(0,0); }
      8%     { opacity: 0.9; transform: translate(4px, 2px); }
      15%    { transform: translate(-2px, -1px); }
      22%    { opacity: 0.7; transform: translate(6px, 0); }
      38%    { opacity: 0.9; transform: translate(-3px, 1px); }
      55%    { opacity: 0.6; transform: translate(2px, -2px); }
      75%    { opacity: 0.9; transform: translate(-4px, 0); }
      90%    { opacity: 0.5; transform: translate(3px, -1px); }
      100%   { opacity: 0;   transform: translate(0,0); }
    }
    /* 見出しテキストの入替アニメ */
    .hero-headline-swap { animation: hero-swap 700ms ease both; }
    @keyframes hero-swap {
      0%   { opacity: 0; transform: translateY(6px); letter-spacing: -0.015em; }
      100% { opacity: 1; transform: translateY(0);  letter-spacing: -0.02em; }
    }
  
/* --- C-LAXiS 版で追加: ABOUT / 04 の絵 / 帯の対象者 --- */
.about-grid{align-items:start}
.about-grid .lead+.lead{margin-top:16px}
.about-tags{font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--muted);margin-top:26px}
.about-stats{border-top-color:var(--line)}
.about-stats span{color:var(--muted)}
.about-em{font-weight:800;color:var(--ink)}
.about-em.hl{color:var(--acid-dark)}
.ill-work{position:absolute;right:26px;top:50%;transform:translateY(-50%);width:104px;height:104px;border-radius:20px;background:var(--ink);color:var(--acid);display:grid;place-items:center;align-content:center;gap:8px}
.ill-work span{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em}
.ill-news{display:flex;gap:12px;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:10px}
.ill-news-ph{width:50px;flex:none}
.ill-news span{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;color:var(--acid-dark)}
.ill-news b{display:block;font-size:13px;margin-top:3px}
.cta-for{margin-top:22px;font-family:var(--mono);font-size:11px;letter-spacing:.16em;opacity:.7}
/* 所属メンバーの丸アイコン (名前の文字の代わり) */
.t-avs{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;position:relative;z-index:1}
.t-av{width:54px;height:54px;border-radius:50%;overflow:hidden;flex:none;background:var(--paper-2);
  border:2px solid var(--white);box-shadow:0 0 0 1px var(--line);transition:transform .3s var(--ease)}
.t-av:hover{transform:translateY(-3px)}
.t-av>img,.t-av>svg{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.tile.dark .t-av{border-color:var(--ink);box-shadow:0 0 0 1px var(--line-dark)}
.tile.mint .t-av{border-color:var(--mint)}
.tile p.t-none{margin-top:18px;font-size:13px;font-weight:700}
/* --- 03 FEATURED: 2 段のテロップ --- */
.mrow{margin-top:56px}
.mrow-head{display:flex;align-items:baseline;gap:18px;margin-bottom:22px}
.mrow-label{font-family:var(--mono);font-size:12px;letter-spacing:.26em;color:var(--acid)}
.mrow-count{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--muted-dark)}
.mticker .splide__track{overflow:hidden}
.mticker:not(.is-initialized) .splide__list{display:flex;gap:22px}   /* パッケージ未読込でも横に並ぶ */
.mcard .ph{border-radius:20px}
.mc-body{display:flex;flex-direction:column;gap:2px;padding:14px 4px 0}
.mc-body b{font-size:17px;font-weight:800;letter-spacing:-.01em}
.mc-body small{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--muted-dark)}
.mc-cat{margin-top:6px;font-size:12px;font-weight:700;color:var(--acid)}
/* パッケージが読めなかった場合も 4 枚ぶんの幅で並べる (読めた場合は Splide が上書きする) */
.mticker:not(.is-initialized) .splide__slide{flex:0 0 calc((100% - 88px) / 5)}
/* 上段は [大きな画像 | 流れる列]、下段は [流れる列 | 大きな画像] で左右を入れ替える */
.mrow-split{display:grid;gap:28px;align-items:end}
.mrow-artist{grid-template-columns:380px minmax(0,1fr)}
.mrow-creator{grid-template-columns:minmax(0,1fr) 380px}
/* 流れる列は、大きな画像と反対側の画面端まで伸ばす */
/* --wrap は中の 100% が列の幅として解釈されてしまうので、画面幅から直接求める */
.mrow-artist .mticker{margin-right:calc((min(1320px, 100vw - 112px) - 100vw) / 2)}
.mrow-creator .mticker{margin-left:calc((min(1320px, 100vw - 112px) - 100vw) / 2)}
.member-hero{position:relative;aspect-ratio:4/5;border-radius:26px;overflow:hidden;background:var(--ink-2,#151a1c)}
.member-hero .slot{position:absolute;inset:0;opacity:0;transition:opacity 1.2s var(--ease)}
.member-hero .slot.on{opacity:1}
.member-hero .slot .ph{height:100%;aspect-ratio:auto;border-radius:0}
.member-hero .cap{position:absolute;left:18px;right:18px;bottom:18px;z-index:3;display:flex;flex-direction:column;gap:4px;
  padding:14px 16px;border-radius:16px;background:rgba(11,14,15,.72);backdrop-filter:blur(6px)}
.member-hero .cap b{font-size:20px;font-weight:800;color:var(--paper)}
.member-hero .cap span{font-size:12px;font-weight:700;color:var(--acid)}
@media (max-width:900px){
  .mrow-artist,.mrow-creator{grid-template-columns:minmax(0,1fr)}
  .mrow-artist .mticker,.mrow-creator .mticker{margin-inline:0}
  .member-hero{width:100%;max-width:380px}
}

    /* ---- 一人ずつの紹介 (C-LAXiS 版で追加) ----
       名前は長さがまちまち (KAKO / KUDO SAKURAKO) なので、折り返しを許して左側に収める */
    #hero-headline-name { font-size: clamp(48px, 5.6vw, 132px) !important; line-height: .9 !important;
                          max-width: min(46vw, 660px); white-space: normal; overflow-wrap: anywhere; }
    /* 暗い写真の間は文字を白に */
    #home[data-tone="dark"] #hero-headline-name,
    #home[data-tone="dark"] #hero-headline-jp,
    #home[data-tone="dark"] #hero-headline-role,
    #home[data-tone="dark"] #hero-slide-index,
    #home[data-tone="dark"] .vertical-rl { color: #fff !important; }
    #home[data-tone="dark"] #hero-headline-jp ~ span,
    #home[data-tone="dark"] #hero-headline-jp + span,
    #home[data-tone="dark"] span:has(+ #hero-headline-jp) { background: #fff !important; }
    #home #hero-headline-name, #home #hero-headline-jp { transition: color .3s ease; }