/* people.html — page-specific styles, extracted from inline */

.cast-intro{background:radial-gradient(ellipse at top,#16263F 0%,transparent 60%),radial-gradient(ellipse at bottom,#0A1424 0%,transparent 70%),#050810;padding:120px 32px 60px;text-align:center;position:relative;overflow:hidden}
.cast-intro .label{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.6em;color:var(--gold);text-transform:uppercase;opacity:.6;margin-bottom:20px}
.cast-intro h1{font-family:'Noto Serif JP',serif;font-weight:300;font-size:clamp(24px,3vw,42px);color:var(--bone);letter-spacing:.06em;line-height:1.5;margin-bottom:24px}
.cast-intro p.en{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(18px,2vw,24px);color:var(--gold);opacity:.75;letter-spacing:.04em}
.cast-intro p.jp{font-family:'Noto Sans JP',sans-serif;font-size:14px;color:var(--bone);opacity:.7;letter-spacing:.04em;margin-top:16px;line-height:1.9}

.cast-roster{background:radial-gradient(ellipse at center,#142540 0%,#0A1424 50%,#050810 90%,#000 100%);padding:80px 32px 120px}
.cast-tier{max-width:1280px;margin:0 auto}
.cast-tier + .cast-tier{margin-top:clamp(64px,8vw,96px)}
.cast-tier-header{text-align:center;margin-bottom:48px;padding:0 24px}
.cast-tier-header .lux-eyebrow{margin-bottom:14px}
.cast-tier-header h2{font-family:'Cinzel',serif;font-weight:400;font-size:clamp(22px,3vw,36px);color:var(--bone);letter-spacing:.4em;text-transform:uppercase;margin-bottom:14px}
.cast-tier-header .sub{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(14px,1.6vw,18px);color:var(--gold);opacity:.7;letter-spacing:.04em}

.cast-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(24px,3vw,40px);
  max-width:1280px;margin:0 auto;
}
@media(max-width:1023px){.cast-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.cast-grid{grid-template-columns:1fr;gap:20px}}

.cast-card{
  background:#142035;
  border:1px solid rgba(184,168,122,.15);
  padding:24px;
  display:flex;flex-direction:column;
  /* Default: 表示。JS で .pre-fade 付与時のみ初期非表示（IntersectionObserver fade-in 用） */
  opacity:1;transform:none;
  transition:opacity .9s var(--ease),transform .9s var(--ease),border-color .4s,background .4s;
  position:relative;
  /* ブロック超え防止 */
  overflow:hidden;
  min-width:0;
}
.cast-card.pre-fade{opacity:0;transform:translateY(24px)}
.cast-card.visible{opacity:1;transform:none}
.cast-card:hover{
  border-color:var(--gold);
  background:#162640;
  transform:translateY(-4px);
  box-shadow:0 12px 40px rgba(0,0,0,.45),0 0 0 1px rgba(184,168,122,.35);
}
.cast-portrait{
  width:100%;aspect-ratio:4/5;
  overflow:hidden;
  margin-bottom:18px;
  position:relative;background:var(--obsidian);
}
.cast-portrait img,.cast-portrait picture{
  width:100%;height:100%;
  display:block;object-fit:cover;object-position:center top;
  /* 元画像の色合いを尊重 — フィルターは適用しない */
  transition:transform 1s var(--ease);
}
.cast-card:hover .cast-portrait img{transform:scale(1.03)}
/* オーバーレイは下端のみ・控えめに（情報の重なりを防ぐため） */
.cast-portrait::after{
  content:"";position:absolute;inset:auto 0 0 0;height:30%;
  background:linear-gradient(180deg,transparent 0%,rgba(5,8,16,.4) 100%);
  pointer-events:none;
}

/* ═══ 詳細を見る — Cinematic NYX accordion (2026-05-10 v2) ═══ */
.cast-card .cast-summary{
  font-family:'Noto Serif JP',serif;font-weight:300;
  font-size:14px;color:var(--bone);opacity:.82;
  line-height:1.9;letter-spacing:.04em;
  word-break:keep-all;overflow-wrap:break-word;line-break:strict;
  margin:0 0 18px;
  /* シンプルなmax-height + opacity (accordion操作はuser triggerのみ → layout-thrash 影響 minimal) */
  max-height:400px;overflow:hidden;
  transition:max-height .6s var(--ease),opacity .5s var(--ease),margin .5s var(--ease);
}
.cast-card.expanded .cast-summary{
  opacity:0;max-height:0;margin:0;
}

.cast-card .cast-details{
  max-height:0;overflow:hidden;opacity:0;
  /* P2-5b: 体感の引っかかり削減。max-height は速く、opacity は素直に追従 */
  transition:max-height .5s cubic-bezier(.16,1,.3,1),
             opacity .35s cubic-bezier(.16,1,.3,1) .05s;
  pointer-events:none;
}
.cast-card.expanded .cast-details{
  max-height:5000px;opacity:1;
  pointer-events:auto;
}
.cast-card .cast-details p,
.cast-card .cast-details .cast-tags{
  word-break:keep-all;overflow-wrap:break-word;line-break:strict;
}
.cast-card .cast-details .cast-body{
  /* 日本語の文節を優先して、語の途中で改行しない。欧文超長単語のみ break-word で逃がす */
  word-break:keep-all;overflow-wrap:break-word;line-break:strict;
  hanging-punctuation:allow-end;
  text-spacing-trim:auto;
}

/* ═══ Trigger — minimalist Cinzel CTA + + icon (English-only) ═══ */
.cast-toggle{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:auto;padding:14px 0;
  background:none;border:none;
  border-top:1px solid rgba(184,168,122,.22);
  font-family:'Cinzel',serif;font-weight:400;
  font-size:11px;letter-spacing:.32em;
  color:var(--gold);text-transform:uppercase;
  cursor:pointer;width:100%;
  text-align:left;
  position:relative;
  transition:color .5s var(--ease),border-color .5s var(--ease);
}
.cast-toggle:hover,
.cast-toggle:focus-visible{
  color:var(--gold-light);
  border-top-color:var(--gold);
}

.cast-toggle .toggle-icon{
  display:inline-block;width:14px;height:14px;
  position:relative;flex-shrink:0;
  transition:transform .6s cubic-bezier(.22,1,.36,1);
}
.cast-toggle .toggle-icon::before,
.cast-toggle .toggle-icon::after{
  content:"";position:absolute;background:currentColor;
  transition:opacity .4s var(--ease);
}
.cast-toggle .toggle-icon::before{
  top:50%;left:0;width:100%;height:1px;transform:translateY(-50%);
}
.cast-toggle .toggle-icon::after{
  left:50%;top:0;width:1px;height:100%;transform:translateX(-50%);
}
.cast-card.expanded .cast-toggle .toggle-icon{transform:rotate(45deg)}
.cast-card.expanded .cast-toggle .toggle-icon::after{opacity:1}

.cast-toggle .label-open,
.cast-toggle .label-close{
  font-family:'Cinzel',serif;font-weight:400;
  font-size:11px;letter-spacing:.32em;
  text-transform:uppercase;
}
.cast-toggle .label-open{display:inline}
.cast-toggle .label-close{display:none}
.cast-card.expanded .cast-toggle .label-open{display:none}
.cast-card.expanded .cast-toggle .label-close{display:inline}

.cast-card .cast-name{
  font-family:'Noto Serif JP',serif;
  font-weight:400;font-size:clamp(18px,1.4vw,22px);
  color:var(--bone);letter-spacing:.04em;
  line-height:1.4;margin:0 0 4px;
}
.cast-card .cast-name-en{
  font-family:'Cinzel',serif;font-weight:400;
  font-size:11px;letter-spacing:.3em;
  color:var(--gold);text-transform:uppercase;
  margin:0 0 6px;line-height:1.4;
}
.cast-card .cast-role{
  font-family:'Cinzel',serif;font-size:10px;
  letter-spacing:.25em;color:var(--gold-dark);
  text-transform:uppercase;
  margin:0 0 14px;line-height:1.6;
  position:relative;padding-bottom:14px;
}
/* メンバー下のゴールド下線は削除（2026-05-11 ユーザー指定） */

.cast-card .cast-body{
  font-family:'Noto Serif JP',serif;font-weight:300;
  font-size:14px;color:var(--bone);opacity:.82;
  line-height:1.9;letter-spacing:.04em;
  word-break:keep-all;line-break:strict;
  margin:0 0 18px;
}
.cast-card .cast-tags{
  display:flex;flex-wrap:wrap;gap:6px;
  margin-top:auto;padding-top:14px;
  border-top:1px solid rgba(184,168,122,.12);
}
.cast-card .cast-tags .tag{
  display:inline-flex;align-items:center;
  padding:5px 11px;
  background:rgba(184,168,122,.1);
  border:1px solid rgba(184,168,122,.32);
  border-radius:14px;
  font-family:'Cinzel',serif;font-size:9.5px;font-weight:400;
  letter-spacing:.18em;color:var(--gold);
  text-transform:uppercase;line-height:1.4;
  white-space:nowrap;
  transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease);
}
.cast-card .cast-tags .tag:hover{
  background:rgba(184,168,122,.22);
  border-color:var(--gold);
  color:var(--gold-light);
}

/* Cast philosophy quote */
.cast-quote{background:linear-gradient(180deg,#0A0F1A 0%,#0F1A2E 50%,#080D17 100%);
  padding:140px 32px;
  text-align:center;
  border-top:1px solid rgba(184,168,122,.1);
}
.cast-quote-inner{max-width:840px;margin:0 auto}
.cast-quote .label{font-family:'Cinzel',serif;font-size:10px;letter-spacing:.5em;color:var(--gold);text-transform:uppercase;opacity:.6;margin-bottom:32px}
.cast-quote .greek-blockquote{
  font-family:'Cinzel','Cormorant Garamond',serif;font-weight:300;
  font-size:clamp(22px,3vw,38px);
  color:var(--gold-light);letter-spacing:.06em;line-height:1.6;
  margin:0 0 24px;
  text-shadow:0 2px 24px rgba(184,168,122,.18);
}
.cast-quote p.en{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:clamp(15px,1.6vw,20px);color:var(--gold);
  opacity:.72;letter-spacing:.04em;
}

@media(max-width:767px){
  .cast-intro{padding:96px 20px 48px}
  .cast-intro h1{font-size:clamp(28px,7vw,40px)}
  .cast-intro p.jp{font-size:13px}
  .cast-roster{padding:48px 16px 64px}
  .cast-tier-header{margin-bottom:28px}
  .cast-tier-header h2{font-size:18px;letter-spacing:.32em}
  .cast-card{padding:18px}
  .cast-portrait{aspect-ratio:4/5}
  .cast-card .cast-name{font-size:18px}
  .cast-card .cast-summary{font-size:13.5px;-webkit-line-clamp:3}
  .cast-card .cast-body{font-size:13.5px}
  .cast-toggle{
    width:100%;justify-content:center;
    padding:12px 18px;font-size:11px;
  }
  .cast-quote{padding:80px 24px}
}

.nyx-skip-to-content{
  position:fixed;left:-9999px;top:8px;z-index:9999;
  padding:10px 16px;background:#0A0A0A;color:#B8A87A;
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:.3em;
  border:1px solid #B8A87A;text-decoration:none;text-transform:uppercase;
}
.nyx-skip-to-content:focus{left:8px}