/* ===== TetraPallete TOP (Concept C / bold colorful) ===== */
:root{
  --ink:#3a322c; --ink-soft:#6d635b; --cream:#FFFDF7;
  --pink:#FF6FA5; --orange:#F5921E; --orange-d:#E0701A; --sky:#3FA9F5; --mint:#33C892; --purple:#B97BF0; --yellow:#F7B500;
  --line-green:#06C755; --maxw:1200px;
  --mincho:"Shippori Mincho",serif; --gothic:"Zen Kaku Gothic New",sans-serif; --en:"Zen Kaku Gothic New",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:hidden;scroll-padding-top:84px}
body{font-family:var(--gothic);color:var(--ink);background:var(--cream);line-height:1.85;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;word-break:auto-phrase}
img{max-width:100%;display:block}
/* casual save-deterrent (NOT real protection — screenshots/devtools still work):
   block image drag, text-selection and the iOS long-press "Save Image" callout. */
img,video{-webkit-user-drag:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.vid__th,.hubss,.grphead__ph,.mem__ph,.disc__art,.aboutfeat__bg,.hub__img,.imgband,.mmodal__media,.hero__bg{-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
a{color:inherit;text-decoration:none}
h1,h2,h3{text-wrap:balance}
p,li{text-wrap:pretty;line-break:strict}
.container{width:min(var(--maxw),92%);margin-inline:auto}

/* living palette = WebGL fluid (ink-in-water marbling) over a pastel base */
.fluid{position:fixed!important;inset:0!important;z-index:0;overflow:hidden;opacity:1;
  background:linear-gradient(125deg,#FFE7F1,#FFF1DE 40%,#EAF4FF 74%,#EAFBF2);
  background-size:200% 200%;background-position:0% 50%;animation:fluidDrift 36s ease-in-out infinite}
@keyframes fluidDrift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@media(prefers-reduced-motion:reduce){.fluid{animation:none}}
.fluid canvas{width:100%!important;height:100%!important;display:block}
/* (legacy blob styles kept harmlessly below; unused) */
.gbg{position:fixed;inset:0;z-index:0;overflow:hidden;background:#FFFDF7}
.gb{position:absolute;border-radius:50%;filter:blur(58px);opacity:.8;will-change:transform}
.gb1{width:64vw;height:64vw;left:-14vw;top:-14vw;background:radial-gradient(circle,#FFD7E8,transparent 70%);animation:drift1 12s ease-in-out infinite}
.gb2{width:58vw;height:58vw;right:-12vw;top:-10vw;background:radial-gradient(circle,#FFE9CC,transparent 70%);animation:drift2 15s ease-in-out infinite}
.gb3{width:54vw;height:54vw;left:6vw;top:26vh;background:radial-gradient(circle,#E2F0FF,transparent 72%);animation:drift3 13s ease-in-out infinite}
.gb4{width:52vw;height:52vw;right:2vw;top:40vh;background:radial-gradient(circle,#E2F6EC,transparent 72%);animation:drift2 16s ease-in-out infinite reverse}
.gb5{width:50vw;height:50vw;left:26vw;bottom:-16vw;background:radial-gradient(circle,#F0E4FF,transparent 70%);animation:drift1 13s ease-in-out infinite reverse}
.gb6{width:46vw;height:46vw;right:20vw;bottom:-12vw;background:radial-gradient(circle,#FFF6D6,transparent 72%);animation:drift3 14s ease-in-out infinite}
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(15vw,9vh) scale(1.22)}50%{transform:translate(8vw,20vh) scale(1.08)}75%{transform:translate(-9vw,11vh) scale(1.26)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(-13vw,13vh) scale(1.16)}50%{transform:translate(-18vw,-7vh) scale(1.28)}75%{transform:translate(-4vw,-15vh) scale(1.1)}}
@keyframes drift3{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(13vw,-11vh) scale(1.2)}50%{transform:translate(19vw,5vh) scale(1.08)}75%{transform:translate(6vw,15vh) scale(1.27)}}
/* fx layers (bokeh light orbs + sharp stars) */
.fx{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.orb{position:absolute;border-radius:50%;will-change:transform;mix-blend-mode:screen;animation:bokeh 18s ease-in-out infinite}
.vstar{position:absolute;background:var(--c,#fff);will-change:transform,opacity;
  clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);animation:twinkle 4s ease-in-out infinite}
@keyframes bokeh{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(var(--dx,4vw),var(--dy,-4vh)) scale(1.18)}}
@keyframes twinkle{0%,100%{transform:scale(.7);opacity:.35}50%{transform:scale(1.1);opacity:1}}
/* film grain (premium texture, static = near-zero cost) */
.grain{position:fixed;inset:0;z-index:3;pointer-events:none;opacity:.05;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");background-size:200px}
#confetti{position:fixed;inset:0;z-index:1;pointer-events:none}
.veil{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(130% 100% at 50% 16%,transparent 46%,rgba(255,253,247,.42) 100%)}
html:not(.js) .gbg{background:linear-gradient(120deg,#FFE7F1,#FFF4E6 45%,#EAF7FF)}

/* hero floating decorations (CSS shapes, transform-only) */
.hero-deco{position:absolute;inset:0;z-index:1;pointer-events:none}
.d{position:absolute;width:34px;height:34px;background:var(--c);will-change:transform;animation:floaty 6s ease-in-out infinite;filter:drop-shadow(0 4px 8px color-mix(in srgb,var(--c) 40%,transparent))}
.d.d-sm{width:21px;height:21px}
.d-star{clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.d-heart{clip-path:polygon(50% 90%,14% 53%,14% 27%,32% 16%,50% 30%,68% 16%,86% 27%,86% 53%)}
.d-note{clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%)}
.d-ring{background:none;border:5px solid var(--c);border-radius:50%}
.hero-deco .d:nth-child(2n){animation-duration:7.6s;animation-delay:-2s}
.hero-deco .d:nth-child(3n){animation-duration:5.4s;animation-delay:-1s}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-15px) rotate(9deg)}}

/* loader */
.loader{display:none}
html.js .loader{display:flex;position:fixed;inset:0;z-index:400;flex-direction:column;align-items:center;justify-content:center;gap:26px;
  background:var(--cream);animation:loaderFail .5s ease 2.6s forwards}
.loader__bars{display:flex;gap:10px}
.loader__bars i{width:14px;height:46px;border-radius:8px;transform-origin:bottom;animation:loaderBar 1s ease-in-out infinite}
.loader__bars i:nth-child(1){background:var(--pink);animation-delay:0s}
.loader__bars i:nth-child(2){background:var(--orange);animation-delay:.12s}
.loader__bars i:nth-child(3){background:var(--sky);animation-delay:.24s}
.loader__bars i:nth-child(4){background:var(--mint);animation-delay:.36s}
.loader__logo{font-family:var(--en);font-weight:800;font-size:1.3rem;letter-spacing:.02em;color:var(--orange-d)}
.loader.is-hidden{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .6s,visibility .6s}
@keyframes loaderBar{0%,100%{transform:scaleY(.5)}50%{transform:scaleY(1)}}
@keyframes loaderFail{to{opacity:0;visibility:hidden}}

/* header */
.hd{position:fixed;inset:0 0 auto 0;z-index:50;padding:18px 0;transition:background .3s,box-shadow .3s,padding .3s}
.hd.scrolled{background:rgba(255,253,247,.82);backdrop-filter:blur(10px);box-shadow:0 4px 24px rgba(200,140,60,.1);padding:10px 0}
.hd__in{display:flex;align-items:center;justify-content:space-between;gap:20px}
.hd__logo{font-family:var(--en);font-weight:800;font-size:1.35rem;letter-spacing:.01em;color:var(--ink)}
.hd__logo b{color:var(--orange)}
.nav{display:flex;align-items:center;gap:clamp(14px,2vw,28px)}
.nav>a{font-family:var(--en);font-weight:600;font-size:.86rem;letter-spacing:.06em;position:relative}
.nav>a:not(.nav__line)::after{content:"";position:absolute;left:0;bottom:-3px;width:0;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--pink),var(--orange));transition:width .25s}
.nav>a:not(.nav__line):hover::after{width:100%}
.nav__line{background:var(--line-green);color:#fff!important;padding:.5em 1.25em!important;border-radius:999px;box-shadow:0 6px 16px rgba(6,199,85,.3)}
.navtog{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.navtog span{width:26px;height:2px;background:var(--ink);border-radius:2px;transition:.3s}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.5em;font-weight:700;font-size:.98rem;padding:.95em 1.9em;border-radius:999px;
  transition:transform .25s,box-shadow .25s,background .25s;will-change:transform}
.btn--p{background:linear-gradient(135deg,#FFB45A,var(--orange));color:#fff;box-shadow:0 10px 26px rgba(245,146,30,.38)}
.btn--g{background:rgba(255,255,255,.82);border:2px solid rgba(245,146,30,.5);color:var(--orange-d)}
.btn--w{background:#fff;color:var(--orange-d)}
.btn--ow{background:rgba(255,255,255,.14);border:2px solid rgba(255,255,255,.8);color:#fff}
.btn--line{background:#fff;color:var(--line-green);box-shadow:0 10px 26px rgba(0,0,0,.12);font-size:1.05rem;padding:1.05em 2.4em}
.btn--sm{padding:.7em 1.4em;font-size:.9rem}
.btn:hover{transform:translateY(-3px)}
.btn--p:hover{box-shadow:0 16px 32px rgba(245,146,30,.5)}

/* reveal-pop */
html.js .reveal-pop{opacity:0;transform:translateY(30px) scale(.96)}

/* sections */
.sec{position:relative;z-index:2;padding:clamp(46px,6vw,86px) 0}
.sh{margin-bottom:clamp(22px,3.2vw,38px)}
.sh__en{font-family:var(--en);font-weight:600;letter-spacing:.1em;font-size:clamp(1.55rem,4.4vw,2.6rem);line-height:1.15;color:#33272e;display:block;padding-left:54px;position:relative}
.sh__en::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:40px;height:4px;border-radius:3px;background:linear-gradient(90deg,var(--pink),var(--orange))}
.sh__ja{display:block;margin-top:.6em;padding-left:54px;font-family:var(--en);font-weight:500;font-size:clamp(.82rem,2vw,1rem);color:var(--ink-soft);letter-spacing:.04em}
.sh__note{margin-top:1.3em;color:var(--ink-soft);font-size:clamp(.92rem,2.4vw,1rem);max-width:52ch;line-height:1.9}
.sh--light .sh__note{color:rgba(255,255,255,.8)}.sh--light .sh__en{color:#fff}.sh--light .sh__ja{color:rgba(255,255,255,.72)}
.sh__en .ch{display:inline-block;will-change:transform}

/* hero */
/* z-index:4 lifts the hero ABOVE the film-grain overlay (.grain, z-index:3, mix-blend-mode).
   Otherwise the grain soft-light-blends over the playing video and forces a full-screen
   re-composite on every decoded frame — a real cost with zero visual benefit (the video has
   its own texture). Lower static sections keep the grain. */
.hero{position:relative;z-index:4;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;padding:120px 0 90px;overflow:hidden}
.hero__bg{position:absolute;inset:0;z-index:0;overflow:hidden;background:#FFE7F1}
.hero__bg video{width:100%;height:100%;object-fit:cover;display:block}
.hero__bg::after{content:'';position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(255,253,247,.62) 0%,rgba(255,253,247,.22) 24%,rgba(255,253,247,.08) 40%),
    radial-gradient(62% 66% at 50% 52%,rgba(255,253,247,.86) 0%,rgba(255,253,247,.56) 44%,rgba(255,253,247,.2) 76%,rgba(255,253,247,.05) 100%)}
@media(prefers-reduced-motion:reduce){.hero__bg video{display:none}.hero__bg{background:linear-gradient(125deg,#FFE7F1,#FFF1DE 40%,#EAF4FF 74%,#EAFBF2)}}
.hero__in{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center}
.eyebrow{font-family:var(--en);font-weight:700;letter-spacing:.34em;font-size:clamp(.68rem,1.6vw,.8rem);color:var(--ink-soft);
  text-transform:uppercase;margin-bottom:28px}
.eyebrow i{color:var(--ink-soft);font-style:normal;margin:0 .55em;opacity:.45}
.hero__h1{font-family:var(--mincho);font-weight:800;line-height:1.18;font-size:clamp(3rem,11vw,8rem);letter-spacing:.02em}
.hero__h1 .ch{display:inline-block;will-change:transform}
.hero__sub{font-family:var(--mincho);font-weight:700;font-size:clamp(1.05rem,2.6vw,1.5rem);margin-top:.7em;color:var(--ink)}
/* solid-ish cream panel for readability; no backdrop-filter:blur — blurring the moving video
   behind it recomputes every frame for a barely-visible 2px effect. Bumped opacity slightly
   to keep contrast without the blur. */
.hero__lead{margin-top:1.5em;font-size:clamp(.96rem,2.3vw,1.1rem);color:var(--ink);max-width:38ch;
  background:rgba(255,253,247,.62);padding:.7em 1.2em;border-radius:14px}
@media(max-width:560px){.hero__lead br{display:none}}
.hero__cta{margin-top:2.2em;display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.hero__scroll{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);width:26px;height:42px;border:2px solid rgba(120,90,60,.4);border-radius:14px;z-index:3}
.hero__scroll span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;background:var(--orange);border-radius:2px;animation:sd 1.6s infinite}
@keyframes sd{0%{opacity:0;transform:translateY(0)}30%,70%{opacity:1}100%{opacity:0;transform:translateY(14px)}}

/* marquee */
.marquee{position:relative;z-index:2;overflow:hidden;white-space:nowrap;padding:18px 0;
  background:rgba(255,253,247,.55);border-block:1px solid rgba(58,50,44,.1)}
.marquee__track{display:inline-flex;will-change:transform;animation:mq 40s linear infinite}
.marquee__track span{font-family:var(--en);font-weight:700;letter-spacing:.28em;font-size:clamp(.72rem,1.5vw,.9rem);color:var(--ink-soft);padding-right:.4rem;text-transform:uppercase}
.marquee__track i{font-style:normal;margin:0 .9em;opacity:.35}
@keyframes mq{to{transform:translateX(-50%)}}

/* about */
.about__lead{text-align:center;max-width:62ch;margin:0 auto clamp(40px,6vw,60px);color:var(--ink-soft);font-size:clamp(.95rem,2.4vw,1.08rem)}
.about__lead b{color:var(--orange-d)}
.biz{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.5vw,28px)}
.biz__c{background:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.7);border-radius:24px;
  padding:clamp(26px,3vw,38px);box-shadow:0 14px 40px rgba(210,150,90,.16);transition:transform .3s,box-shadow .3s}
.biz__c:hover{box-shadow:0 22px 50px rgba(245,146,30,.22)}
.biz__ic{display:inline-flex;align-items:center;justify-content:center;width:84px;height:84px;border-radius:24px;margin-bottom:18px;
  background:var(--cc,var(--orange));box-shadow:0 10px 22px color-mix(in srgb,var(--cc,#F5921E) 45%,transparent)}
.biz__c h3{font-family:var(--mincho);font-weight:700;font-size:1.3rem;margin-bottom:.5em}
.biz__c p{color:var(--ink-soft);font-size:.96rem}
.biz__more{display:inline-block;margin-top:1em;color:var(--orange-d);font-weight:700;font-size:.92rem}
.biz__more:hover{text-decoration:underline}
.stats{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:clamp(40px,6vw,64px);
  background:rgba(255,255,255,.7);border:1px solid rgba(58,50,44,.08);border-radius:20px;padding:clamp(28px,4vw,44px);box-shadow:0 10px 30px rgba(80,60,40,.07)}
.stats li{text-align:center;display:flex;flex-direction:column;gap:.4em;position:relative}
.stats li:not(:last-child)::after{content:"";position:absolute;right:-9px;top:14%;height:72%;width:1px;background:rgba(58,50,44,.1)}
.stats b{font-family:var(--mincho);font-weight:800;font-size:clamp(2rem,5vw,3rem);line-height:1;color:var(--ink)}
.stats span{font-size:.82rem;letter-spacing:.04em;color:var(--ink-soft)}

/* artists */
.agrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,32px);margin-bottom:clamp(34px,5vw,52px)}
.ac{background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 16px 44px rgba(210,150,90,.18);transition:transform .35s,box-shadow .35s}
.ac:nth-child(even){transform:translateY(24px)}
.ac__ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:linear-gradient(135deg,var(--cc,#FF6FA5),var(--cc2,#FFD86B))}
.ac__ph img{width:100%;height:100%;object-fit:cover}
.ac__ph img.miss{opacity:0}
.ac__phl{display:none;position:absolute;inset:0;flex-direction:column;align-items:center;justify-content:center;gap:.3em;
  color:#fff;font-weight:800;font-size:1.05rem;text-shadow:0 2px 10px rgba(0,0,0,.18)}
.ac__phl small{font-weight:500;font-size:.72rem;opacity:.9}
.ac__ph img.miss + .ac__phl{display:flex}
.ac__b{padding:22px clamp(20px,2.4vw,26px) 26px;position:relative}
.ac__b::before{content:"";position:absolute;left:0;top:0;width:100%;height:6px;background:linear-gradient(90deg,var(--cc),var(--cc2))}
.ac__b h3{font-family:var(--en);font-weight:800;font-size:1.4rem}
.ac__c{font-family:var(--mincho);color:var(--orange-d);font-size:1rem;margin:.3em 0 .6em}
.ac__d{color:var(--ink-soft);font-size:.92rem;margin-bottom:1em}
.ac__sns{display:flex;flex-wrap:wrap;gap:8px}
.ac__sns a{font-family:var(--en);font-size:.78rem;font-weight:600;padding:.4em 1em;border-radius:999px;border:1.5px solid rgba(245,146,30,.35);color:var(--orange-d);transition:.25s}
.ac__sns a:hover{background:var(--orange);color:#fff;border-color:var(--orange)}

/* movie (dark panel) */
.movie{}
.movie .container{position:relative}
.movie .sh,.movie .mgrid,.movie .movie__cta{position:relative;z-index:1}
.movie::before{content:"";position:absolute;inset:clamp(40px,6vw,80px) 0;z-index:0;border-radius:36px;
  background:#241f1b;box-shadow:0 30px 80px rgba(0,0,0,.3)}
.movie>.container{padding:clamp(34px,5vw,64px) clamp(20px,3vw,48px)}
.mgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,2vw,20px)}
.mgrid--sub{grid-template-columns:repeat(3,1fr);margin-top:clamp(16px,2.4vw,26px)}
.vid.vid--hero{grid-column:1 / -1;aspect-ratio:21/9}
.vid{position:relative;border:0;padding:0;cursor:pointer;border-radius:16px;overflow:hidden;background:#000;aspect-ratio:16/9;width:100%;transition:transform .3s,box-shadow .3s}
.vid--lg{grid-column:span 2;grid-row:span 2}
.vid:hover{box-shadow:0 18px 40px rgba(0,0,0,.5)}
.vid__th{position:absolute;inset:0;background:linear-gradient(135deg,rgba(245,146,30,.4),rgba(185,123,240,.35)),repeating-linear-gradient(45deg,#2c2620,#2c2620 18px,#322b24 18px,#322b24 36px)}
.vid__th::after{content:"";position:absolute;top:10px;right:12px;width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.5);box-shadow:0 0 0 4px rgba(255,255,255,.12)}
.vid__pl{position:absolute;top:50%;left:50%;width:56px;height:56px;transform:translate(-50%,-50%);border-radius:50%;background:rgba(255,255,255,.92);transition:.25s}
.vid__pl::after{content:"";position:absolute;top:50%;left:54%;transform:translate(-50%,-50%);border-left:16px solid var(--orange);border-top:10px solid transparent;border-bottom:10px solid transparent}
.vid:hover .vid__pl{transform:translate(-50%,-50%) scale(1.12)}
.vid__m{position:absolute;left:0;right:0;bottom:0;padding:30px 16px 14px;text-align:left;background:linear-gradient(transparent,rgba(0,0,0,.8));color:#fff;display:flex;flex-direction:column}
.vid__m b{font-weight:700;font-size:1rem}.vid__m small{font-family:var(--en);font-size:.72rem;opacity:.8}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.movie__cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:clamp(30px,4vw,48px)}

/* audition (vivid band) */
.aud{overflow:hidden}
.aud::before{content:"";position:absolute;inset:clamp(30px,5vw,60px) 0;z-index:0;border-radius:36px;
  background:linear-gradient(120deg,#FF6FA5,#F5921E 45%,#3FA9F5);box-shadow:0 24px 70px rgba(245,120,160,.35)}
.aud__in{position:relative;z-index:1;text-align:center;color:#fff;padding:clamp(30px,5vw,56px) 0}
.aud__en{font-family:var(--en);font-weight:600;letter-spacing:.2em;font-size:.9rem;opacity:.95}
.aud__h{font-family:var(--mincho);font-weight:800;font-size:clamp(2rem,6vw,3.4rem);line-height:1.3;margin:.3em 0 .5em;text-shadow:0 4px 18px rgba(180,90,40,.25)}
.aud__d{font-size:clamp(.95rem,2.6vw,1.1rem);margin-bottom:1.6em;text-shadow:0 2px 10px rgba(180,90,40,.2)}
.aud__cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* news */
.news__embed{aspect-ratio:16/6;border-radius:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5em;text-align:center;
  color:var(--orange-d);font-weight:700;background:rgba(255,255,255,.85);border:2px dashed rgba(245,146,30,.4)}
.news__embed small{font-weight:400;color:var(--ink-soft)}

/* per-group schedule calendar (talent.html) */
.gcal{margin-top:clamp(24px,3.2vw,40px)}
.gcal__h{display:flex;align-items:baseline;gap:.7em;flex-wrap:wrap;margin-bottom:.85em;font-size:1.05rem;font-weight:700}
.gcal__en{font-family:var(--en);font-size:.72rem;letter-spacing:.14em;color:color-mix(in srgb,var(--cc,#FF6FA5) 70%,#4a3a2c)}
.gcal__embed{min-height:clamp(200px,30vw,340px);border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5em;text-align:center;padding:18px;
  color:color-mix(in srgb,var(--cc,#FF6FA5) 68%,#4a3a2c);font-weight:700;background:color-mix(in srgb,var(--cc,#FF6FA5) 7%,#fff);border:2px dashed color-mix(in srgb,var(--cc,#FF6FA5) 40%,transparent)}
.gcal__embed small{font-weight:400;color:var(--ink-soft)}
.gcal__embed iframe{width:100%;min-height:inherit;border:0;border-radius:20px;display:block}
/* live calendar: drop the dashed placeholder look, just a rounded frame around the iframe */
.gcal__embed--cal{min-height:0;padding:0;gap:0;background:none;border:0;display:block;overflow:hidden;box-shadow:0 6px 24px rgba(120,90,60,.10)}

/* discography (music.html) */
.disco{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.7vw,18px)}
.disc{background:#fff;border-radius:14px;padding:14px;border:1px solid rgba(58,50,44,.08);box-shadow:0 6px 18px rgba(80,60,40,.06);transition:transform .3s,box-shadow .3s}
.disc:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(80,60,40,.12)}
.disc__art{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center;margin-bottom:12px;background:linear-gradient(140deg,var(--orange),color-mix(in srgb,var(--orange) 28%,#fff))}
.disc__art::after{content:"♪";font-size:2.2rem;color:#fff;opacity:.92;text-shadow:0 2px 8px rgba(0,0,0,.18)}
/* the ♪ is only a fallback for a missing jacket — hide it whenever a real image is present */
.disc__art:has(img:not(.miss))::after{content:none}
.disc__art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.disc__art img.miss{opacity:0}
.disc:nth-child(4n+2) .disc__art{background:linear-gradient(140deg,var(--pink),color-mix(in srgb,var(--pink) 26%,#fff))}
.disc:nth-child(4n+3) .disc__art{background:linear-gradient(140deg,var(--purple),color-mix(in srgb,var(--purple) 26%,#fff))}
.disc:nth-child(4n) .disc__art{background:linear-gradient(140deg,var(--sky),color-mix(in srgb,var(--sky) 26%,#fff))}
.disc__type{font-family:var(--en);font-size:.66rem;font-weight:600;letter-spacing:.1em;color:color-mix(in srgb,var(--orange) 70%,#4a3a2c)}
.disc__title{font-weight:700;font-size:1rem;line-height:1.3;margin-top:.15em}
.disc__date{font-family:var(--en);font-size:.78rem;color:var(--ink-soft);margin-top:.25em}
.disco__cta{margin-top:clamp(22px,3vw,34px);text-align:center}
.disco__group{display:flex;align-items:center;gap:.55em;font-weight:700;font-size:1.15rem;margin:0 0 clamp(14px,2vw,20px)}
.disco__group::before{content:"";width:24px;height:4px;border-radius:3px;background:var(--gc,var(--orange))}
.disco__group--2{margin-top:clamp(38px,5.5vw,64px)}
@media(max-width:900px){.disco{grid-template-columns:repeat(2,1fr)}}

/* footer */
.ft{position:relative;z-index:2;background:#2a241f;color:#e9ddd1;padding:clamp(44px,5.5vw,68px) 0 26px;margin-top:clamp(28px,4vw,56px)}
.ft__grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(34px,5vw,64px);align-items:center}
.hd__logo--ft{display:inline-block;font-size:1.6rem;color:#fff;margin-bottom:12px}
.hd__logo--ft b{color:var(--orange)}
.ft__tag{font-family:var(--mincho);font-size:1.05rem;color:#fff;margin-bottom:1.2em}
.ft__sns{display:flex;flex-wrap:wrap;gap:10px}
.ft__sns a{font-family:var(--en);font-size:.82rem;padding:.45em 1.1em;border:1px solid rgba(255,255,255,.22);border-radius:999px;transition:.25s}
.ft__sns a:hover{background:var(--orange);border-color:var(--orange);color:#fff}
.ft h3{font-family:var(--en);font-weight:600;font-size:1.15rem;color:#fff;margin-bottom:.6em;letter-spacing:.02em}
.ft p{color:#c9bcb0;font-size:.94rem;margin-bottom:1em}
.ft__line a{color:var(--orange);font-family:var(--en)}.ft__line a:hover{text-decoration:underline}
/* footer contact: email/tel on the left, the form button to their right */
.ft__cta-row{display:flex;align-items:center;gap:clamp(18px,2.5vw,32px);flex-wrap:wrap}
.ft__cta-row .ft__line{margin-bottom:0}
.ft .btn--g{border-color:rgba(255,180,90,.6);color:#FFB45A;background:transparent}
.ft .btn--g:hover{background:var(--orange);color:#fff;border-color:var(--orange)}
.ft__co{font-size:.84rem;color:#a89c90;margin-top:1.4em}
.ft__cp{text-align:center;font-family:var(--en);font-size:.78rem;color:#8a7e72;margin-top:clamp(40px,6vw,64px);border-top:1px solid rgba(255,255,255,.1);padding-top:24px}

/* responsive */
@media(max-width:900px){
  .nav{position:fixed;inset:0 0 0 auto;width:min(78vw,320px);flex-direction:column;justify-content:center;gap:26px;
    background:rgba(255,253,247,.97);backdrop-filter:blur(12px);box-shadow:-10px 0 40px rgba(180,120,40,.15);transform:translateX(100%);transition:transform .35s;z-index:60}
  .nav.open{transform:none}.nav>a{font-size:1.1rem}
  /* CRITICAL: .hd.scrolled's backdrop-filter makes the header a containing block for the
     position:fixed mobile nav, collapsing it to header height when scrolled (menu "breaks"
     at the bottom of the page). Drop the blur on mobile so the nav stays viewport-fixed. */
  .hd.scrolled{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(255,253,247,.92)}
  .navtog{display:flex;z-index:61}
  .navtog.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .navtog.open span:nth-child(2){opacity:0}
  .navtog.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .biz,.agrid,.stats{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .ac:nth-child(even){transform:none}
  .mgrid{grid-template-columns:1fr 1fr}.vid--lg{grid-column:span 2;grid-row:auto}
  .memg{grid-template-columns:repeat(3,1fr)}
  .ft__grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .stats{grid-template-columns:1fr}
  .mgrid{grid-template-columns:1fr}.vid--lg{grid-column:auto}
  .memg{grid-template-columns:repeat(2,1fr)}
  .hero{min-height:auto;padding:120px 0 80px}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important}
  html.js .reveal-pop{opacity:1;transform:none}
  html.js .loader{display:none!important}
  .marquee__track{transform:none!important}
  #grad{filter:none;background:linear-gradient(120deg,#FFE7F1,#FFF4E6 45%,#EAF7FF)!important}
}

/* ===================================================================
   RESTRUCTURE: 4-business hub TOP + signature-color business pages
   (shared design system; fluid stays TOP-only — sub-pages use .subbg)
   =================================================================== */

/* signature-color drifting wash for business pages (replaces .fluid) */
.subbg{position:fixed;inset:0;z-index:0;overflow:hidden;background:var(--cream)}
.subbg::before{content:"";position:absolute;inset:-10%;
  background:
    radial-gradient(42% 38% at 14% 8%, color-mix(in srgb,var(--pg,#FF6FA5) 30%,transparent), transparent 70%),
    radial-gradient(40% 36% at 88% 16%, color-mix(in srgb,var(--pg,#FF6FA5) 20%,transparent), transparent 72%),
    radial-gradient(60% 54% at 52% 112%, color-mix(in srgb,var(--pg,#FF6FA5) 20%,transparent), transparent 74%);
  background-size:170% 170%;background-position:0% 50%;animation:fluidDrift 46s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.subbg::before{animation:none}}

/* TOP hero: real corporate catch (longer line → smaller than the old 8-char hero) */
.hero__h1--catch{font-size:clamp(1.9rem,6.2vw,4.4rem);line-height:1.32;max-width:17ch;letter-spacing:.04em}

/* signature-color buttons (driven by --cc) */
.btn--cc{background:linear-gradient(135deg,color-mix(in srgb,var(--cc,#FF6FA5) 72%,#fff),var(--cc,#FF6FA5));color:#fff;
  box-shadow:0 10px 26px color-mix(in srgb,var(--cc,#FF6FA5) 40%,transparent)}
.btn--cc:hover{box-shadow:0 16px 32px color-mix(in srgb,var(--cc,#FF6FA5) 55%,transparent)}
.btn--ccg{background:rgba(255,255,255,.86);border:2px solid color-mix(in srgb,var(--cc,#FF6FA5) 50%,transparent);
  color:color-mix(in srgb,var(--cc,#FF6FA5) 72%,#4a3a2c)}
.btn--linep{background:var(--line-green);color:#fff;box-shadow:0 8px 22px rgba(6,199,85,.26)}
.btn--linep:hover{box-shadow:0 14px 30px rgba(6,199,85,.36)}

/* nav dropdown (TALENT ▾) */
.nav__drop{position:relative;display:flex;align-items:center}
.nav__dtop{font-family:var(--en);font-weight:700;font-size:.86rem;letter-spacing:.06em;cursor:pointer;display:inline-flex;align-items:center;gap:.4em;position:relative}
.nav__dtop::before{content:"▾";font-size:.7em;opacity:.6;order:2}
.nav__menu{position:absolute;left:50%;top:100%;transform:translateX(-50%) translateY(10px);min-width:172px;
  background:rgba(255,253,247,.98);backdrop-filter:blur(10px);border:1px solid rgba(245,146,30,.18);border-radius:14px;
  box-shadow:0 16px 40px rgba(200,140,60,.2);padding:8px;display:flex;flex-direction:column;gap:2px;
  opacity:0;visibility:hidden;transition:opacity .2s,transform .2s;z-index:60}
.nav__drop:hover .nav__menu,.nav__drop:focus-within .nav__menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(4px)}
.nav__menu a{font-family:var(--gothic);font-weight:700;font-size:.82rem;padding:.55em .8em;border-radius:9px;white-space:nowrap}
.nav__menu a:hover{background:rgba(245,146,30,.1);color:var(--orange-d)}

/* business sub-page hero */
.phero{position:relative;z-index:2;padding:clamp(104px,12vw,150px) 0 clamp(22px,3.4vw,42px)}
.crumb{font-family:var(--en);font-size:.78rem;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:18px}
.crumb a:hover{color:var(--cc,var(--orange))}
.phero__en{font-family:var(--en);font-weight:600;letter-spacing:.1em;font-size:clamp(1.9rem,5.6vw,3.3rem);line-height:1.14;color:var(--cc,var(--orange));display:block;padding-left:58px;position:relative;white-space:nowrap}
.phero__en::before{content:"";position:absolute;left:0;top:.62em;width:44px;height:4px;border-radius:3px;background:var(--cc,var(--orange))}
.phero__title{display:block;margin:.5em 0 0;padding-left:58px;font-family:var(--en);font-weight:600;font-size:clamp(1.3rem,3.2vw,1.75rem);color:var(--ink);letter-spacing:.01em;line-height:1.4}
.phero__lead{max-width:64ch;margin-top:1.2em;color:var(--ink-soft);font-size:clamp(.95rem,2.4vw,1.08rem);line-height:1.9}
.phero__cta{margin-top:1.6em;display:flex;gap:14px;flex-wrap:wrap}
/* mobile: keep the page-hero English label on ONE line (shrink to fit, never break mid-word).
   Placed AFTER .phero__en so it wins the cascade at equal specificity. */
@media(max-width:560px){
  .phero__en{font-size:clamp(1.1rem,6vw,1.95rem);padding-left:32px}
  .phero__en::before{width:21px}
  .phero__title{padding-left:32px}
}

/* TOP: tighter vertical rhythm between sections (sub-pages keep the roomier default) */
body:not(.sub) .sec{padding:clamp(46px,6vw,86px) 0}
body:not(.sub) .sh{margin-bottom:clamp(18px,2.6vw,32px)}
body:not(.sub) .ft{margin-top:clamp(24px,3.5vw,50px)}
body:not(.sub) .hero{padding:120px 0 64px}

/* TOP: 4-business equal hub (image-led cards) */
.hub{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2.4vw,26px)}
.hub__c{position:relative;display:flex;flex-direction:column;border-radius:22px;overflow:hidden;
  background:#fff;border:1px solid rgba(58,50,44,.08);box-shadow:0 10px 30px rgba(80,60,40,.07);
  transition:transform .35s,box-shadow .35s,border-color .35s}
.hub__c:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--cc) 30%,transparent);box-shadow:0 22px 50px color-mix(in srgb,var(--cc) 16%,rgba(80,60,40,.1))}
.hub__img{position:relative;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(135deg,var(--cc),color-mix(in srgb,var(--cc) 38%,#fff))}
.hub__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.hub__c:hover .hub__img img{transform:scale(1.04)}
.hub__img img.miss{opacity:0}
.hub__imgfb{display:none;position:absolute;inset:0;align-items:center;justify-content:center}
.hub__imgfb svg{opacity:.9}
.hub__img img.miss + .hub__imgfb{display:flex}
.hub__no{position:absolute;top:12px;right:15px;font-family:var(--en);font-weight:800;font-size:1.4rem;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.28);z-index:3}
/* MUSIC card jacket slideshow: ambient blurred backdrop + full jacket, soft crossfade.
   Built with divs (not <img>) so the .hub__img img hover/fallback rules don't apply. */
.hubss{position:absolute;inset:0;z-index:1;overflow:hidden;background:linear-gradient(135deg,var(--cc),color-mix(in srgb,var(--cc) 38%,#fff));opacity:0;visibility:hidden;transition:opacity .45s ease,visibility .45s ease}
.hub__c:hover .hubss,.hub__c:focus-within .hubss{opacity:1;visibility:visible}
.hubss__layer{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease}
.hubss__layer.is-on{opacity:1}
.hubss__bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:blur(16px) brightness(.9) saturate(1.1);transform:scale(1.2)}
.hubss__fg{position:absolute;inset:9% 0;background-size:contain;background-repeat:no-repeat;background-position:center;filter:drop-shadow(0 8px 22px rgba(0,0,0,.4));transition:transform .5s ease}
.hub__c:hover .hubss__layer.is-on .hubss__fg{transform:scale(1.05)}
.hub__body{display:flex;flex-direction:column;align-items:flex-start;gap:.65em;padding:clamp(22px,2.6vw,32px)}
.hub__en{font-family:var(--en);font-weight:600;letter-spacing:.16em;font-size:.7rem;color:var(--cc);text-transform:uppercase}
.hub__c h3{font-family:var(--en);font-weight:600;font-size:clamp(1.35rem,3vw,1.75rem);line-height:1.3}
.hub__c p{color:var(--ink-soft);font-size:.94rem;line-height:1.9}
.hub__more{margin-top:.3em;color:var(--cc);font-weight:600;font-size:.88rem;letter-spacing:.02em}
.hub__c:hover .hub__more{text-decoration:underline}

/* generic image band (business-page hero banner + about visual) */
.imgband{position:relative;overflow:hidden;border-radius:24px;
  background:linear-gradient(135deg,var(--cc,#F5921E),color-mix(in srgb,var(--cc,#F5921E) 38%,#fff));
  box-shadow:0 16px 50px rgba(80,60,40,.1)}
.imgband img{width:100%;height:100%;object-fit:cover;display:block}
.imgband img.miss{opacity:0}
.imgband__fb{display:none;position:absolute;inset:0;flex-direction:column;align-items:center;justify-content:center;gap:.3em;
  color:#fff;font-weight:700;text-align:center;padding:16px;text-shadow:0 2px 12px rgba(0,0,0,.22)}
.imgband__fb small{font-weight:500;font-size:.74rem;opacity:.85;letter-spacing:.02em}
.imgband img.miss + .imgband__fb{display:flex}

/* about feature: live photo + light white filter + translucent text panel on the left */
.aboutfeat{position:relative;border-radius:24px;overflow:hidden;display:flex;align-items:center;
  min-height:clamp(340px,44vw,520px);box-shadow:0 16px 50px rgba(80,60,40,.12)}
.aboutfeat__bg{position:absolute;inset:0;background:linear-gradient(135deg,#FFE7F1,#EAF4FF)}
.aboutfeat__bg img{width:100%;height:100%;object-fit:cover;object-position:center 48%}
.aboutfeat__bg img.miss{opacity:0}
.aboutfeat__scrim{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,253,247,.94) 0%,rgba(255,253,247,.8) 30%,rgba(255,253,247,.36) 58%,rgba(255,253,247,.14) 100%),
             linear-gradient(0deg,rgba(255,253,247,.22),rgba(255,253,247,.22))}
.aboutfeat__in{position:relative;z-index:2;max-width:min(560px,60%);padding:clamp(26px,4vw,54px)}
.aboutfeat__panel{background:rgba(255,255,255,.46);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  border:1px solid rgba(255,255,255,.7);border-radius:18px;padding:clamp(22px,3vw,34px);box-shadow:0 10px 30px rgba(80,60,40,.1)}
.aboutfeat__panel .about-lead{margin-bottom:0}
@media(max-width:720px){
  .aboutfeat{min-height:auto}
  .aboutfeat__in{max-width:100%;padding:16px}
  .aboutfeat__scrim{background:linear-gradient(0deg,rgba(255,253,247,.88),rgba(255,253,247,.66))}
  .aboutfeat__bg img{object-position:center 50%}
}

/* TOP: about / company */
.about-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,60px);align-items:start}
.about-lead{color:var(--ink-soft);font-size:clamp(.95rem,2.4vw,1.06rem);line-height:1.9}
.about-lead b{color:var(--orange-d)}
.about-catch{font-family:var(--mincho);font-weight:700;font-size:clamp(1.3rem,3.2vw,1.8rem);line-height:1.5;margin-bottom:.7em;color:var(--ink)}
.company{display:grid;grid-template-columns:auto 1fr;gap:0 18px}
.company dt{font-weight:700;font-size:.88rem;padding:13px 0;border-top:1px solid rgba(120,90,60,.14)}
.company dd{color:var(--ink-soft);font-size:.9rem;padding:13px 0;border-top:1px solid rgba(120,90,60,.14)}

/* refined CTA panel (light, tonal — TOP contact + page CTAs, keyed by --cc) */
.ctaband,.ccband{position:relative;overflow:hidden}
.ctaband::before,.ccband::before{content:"";position:absolute;inset:clamp(16px,3vw,36px) 0;z-index:0;border-radius:28px;
  background:color-mix(in srgb,var(--cc,#F5921E) 7%,var(--cream));
  border:1px solid color-mix(in srgb,var(--cc,#F5921E) 20%,transparent)}
.ctaband__in{position:relative;z-index:1;text-align:center;color:var(--ink);padding:clamp(36px,5vw,66px) 24px;max-width:760px;margin-inline:auto}
.ctaband__en{font-family:var(--en);font-weight:600;letter-spacing:.2em;font-size:.76rem;text-transform:uppercase;color:color-mix(in srgb,var(--cc,#E0701A) 78%,#4a3a2c)}
/* scope to __in so BOTH variants (.ctaband on TOP / .ccband on sub-pages) get the spacing.
   Previously these were .ctaband-only, so on .ccband pages the *{margin:0} reset left the
   heading/text/buttons cramped together. */
.ctaband__in h2{font-family:var(--mincho);font-weight:800;font-size:clamp(1.7rem,4.4vw,2.6rem);margin:.55em 0 .4em;color:var(--ink)}
.ctaband__in p{margin-bottom:1.7em;color:var(--ink-soft)}
.ctaband__btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* talent: group blocks + member grid */
.grp{padding-top:clamp(16px,2.8vw,34px)}
/* separate consecutive groups (e.g. HALO calendar → ヒトノユメ) with breathing room +
   an elegant divider: a soft hairline that fades at the ends and parts in the centre for a
   small ✦ sparkle, tinted to the next group's signature colour (--cc). */
.grp + .grp{margin-top:clamp(34px,5.5vw,60px);padding-top:clamp(40px,5.8vw,64px);position:relative}
.grp + .grp::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:min(460px,84%);height:1px;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--cc) 34%,transparent) 26%,transparent 45%,transparent 55%,color-mix(in srgb,var(--cc) 34%,transparent) 74%,transparent)}
.grp + .grp::after{content:"✦";position:absolute;top:0;left:50%;transform:translate(-50%,-50%);
  font-size:.82rem;line-height:1;color:color-mix(in srgb,var(--cc) 72%,#7a6a76);opacity:.92}
.grphead{display:grid;grid-template-columns:1fr 1.08fr;gap:clamp(22px,3.5vw,46px);align-items:center}
.grphead__ph{position:relative;aspect-ratio:4/3;border-radius:24px;overflow:hidden;
  background:linear-gradient(135deg,var(--cc,#FF6FA5),color-mix(in srgb,var(--cc,#FF6FA5) 35%,#FFD86B));box-shadow:0 18px 50px rgba(210,150,90,.2)}
.grphead__ph img{width:100%;height:100%;object-fit:cover}
.grphead__ph img.miss{opacity:0}
.grphead__phl{display:none;position:absolute;inset:0;flex-direction:column;align-items:center;justify-content:center;gap:.2em;color:#fff;font-weight:800;text-align:center;padding:14px;text-shadow:0 2px 10px rgba(0,0,0,.2)}
.grphead__phl small{font-weight:500;font-size:.72rem;opacity:.9}
.grphead__ph img.miss + .grphead__phl{display:flex}
.grphead__no{font-family:var(--en);font-weight:600;letter-spacing:.14em;font-size:.74rem;color:var(--cc)}
.grphead__name{font-family:var(--en);font-weight:800;font-size:clamp(1.7rem,4vw,2.5rem);margin:.1em 0}
.grphead__cc{font-family:var(--mincho);color:color-mix(in srgb,var(--cc) 70%,#4a3a2c);font-size:1.05rem;margin-bottom:.5em}
.grphead__d{color:var(--ink-soft);font-size:.95rem;margin-bottom:1em}
.tagrow{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:1em}
.tagrow span{font-size:.76rem;padding:.4em .9em;border-radius:999px;background:color-mix(in srgb,var(--cc) 13%,#fff);color:color-mix(in srgb,var(--cc) 70%,#4a3a2c)}
.snsrow{display:flex;gap:8px;flex-wrap:wrap}
.snsrow a{font-family:var(--en);font-size:.78rem;font-weight:600;padding:.4em 1em;border-radius:999px;border:1.5px solid color-mix(in srgb,var(--cc) 45%,transparent);color:color-mix(in srgb,var(--cc) 70%,#4a3a2c);transition:.25s}
.snsrow a:hover{background:var(--cc);color:#fff;border-color:var(--cc)}
.memg{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(10px,1.6vw,18px);margin-top:clamp(20px,3vw,34px)}
.mem{background:#fff;border-radius:14px;overflow:hidden;border:1px solid rgba(58,50,44,.07);box-shadow:0 6px 20px rgba(80,60,40,.06)}
.mem__ph{position:relative;aspect-ratio:3/4;background:linear-gradient(135deg,var(--mc,#FF6FA5),color-mix(in srgb,var(--mc,#FF6FA5) 30%,#fff))}
.mem__ph img{width:100%;height:100%;object-fit:cover}
.mem__ph img.miss{opacity:0}
.mem__phl{display:none;position:absolute;inset:0;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.9rem;text-align:center;padding:8px;text-shadow:0 2px 8px rgba(0,0,0,.22)}
.mem__ph img.miss + .mem__phl{display:flex}
.mem__b{padding:12px 13px 15px}
.mem__n{font-weight:600;font-size:.98rem}
.mem__k{font-size:.72rem;color:var(--ink-soft)}
.mem__m{display:flex;align-items:center;gap:6px;font-size:.74rem;color:var(--ink-soft);margin-top:.35em}
.mem__c{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.12);flex:none}
.mem__sns{display:flex;gap:6px;margin-top:.55em;flex-wrap:wrap}
.mem__sns a{width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1.4px solid color-mix(in srgb,var(--mc,#FF6FA5) 55%,var(--ink-soft));color:color-mix(in srgb,var(--mc,#FF6FA5) 55%,var(--ink));transition:.2s}
.mem__sns a svg{width:14px;height:14px}
.mem__sns a:hover{background:color-mix(in srgb,var(--mc,#FF6FA5) 70%,var(--ink-soft));color:#fff;border-color:transparent}
/* member hover reveal: profile traits over the photo */
.mem{transition:transform .3s,box-shadow .3s}
.mem:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(80,60,40,.14)}
.mem--bio{cursor:pointer}
.mem__ph img{transition:transform .55s ease}
.mem--bio:hover .mem__ph img,.mem--bio:focus-within .mem__ph img,.mem--bio.is-open .mem__ph img{transform:scale(1.06)}
.mem__over{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:.5em;padding:13px 12px;color:#fff;text-align:left;
  background:linear-gradient(to top,color-mix(in srgb,var(--mc,#FF6FA5) 84%,#15101c) 0%,color-mix(in srgb,var(--mc,#FF6FA5) 42%,rgba(21,16,28,.5)) 46%,rgba(21,16,28,0) 100%);
  opacity:0;transform:translateY(10px);transition:opacity .33s,transform .33s;pointer-events:none}
.mem--bio:not(.mem--gallery):hover .mem__over,.mem--bio:not(.mem--gallery):focus-within .mem__over,.mem--bio.is-open .mem__over{opacity:1;transform:none}
.mem__over h4{font-size:.64rem;font-weight:600;font-family:var(--en);letter-spacing:.14em;opacity:.85;margin-bottom:.05em}
.mem__tags{display:flex;flex-wrap:wrap;gap:5px}
.mem__tags span{font-size:.66rem;line-height:1.2;padding:.32em .6em;border-radius:999px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.34);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.mem__more{position:absolute;top:9px;right:9px;width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.92);color:color-mix(in srgb,var(--mc,#FF6FA5) 72%,#3a2a3c);font-size:.9rem;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.18);transition:opacity .3s;pointer-events:none}
.mem--bio:not(.mem--gallery):hover .mem__more,.mem--bio:not(.mem--gallery):focus-within .mem__more,.mem--bio:not(.mem--gallery).is-open .mem__more{opacity:0}
/* member photo gallery: next アー写 slides out from behind and overtakes on hover */
.mem__shots{position:absolute;inset:0}
.mem__shot{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:1;overflow:hidden}
.mem__shot.is-active{z-index:3}
.mem__shot img{width:100%;height:100%;object-fit:cover}
/* 空音ふさ: her photo frames the head higher than the others, so default centre-crop made her
   look taller. Nudge the crop window down (head sits ~7% from the top, in line with the group;
   measured against みか8%/みり4%). 18% chosen over `top`(9%) to centre her within the row. */
.mem--align-head .mem__shot img,.mem--align-head .mem__ph>img{object-position:center 18%}
.mem__shot img.miss{opacity:0}
.mem__shot--ph{background:linear-gradient(150deg,#ffd9e8,#ece3f7)}
.mem__shot--ph2{background:linear-gradient(150deg,#dcebfb,#f7e4ef)}
.mem__shotlbl{position:relative;z-index:1;font-family:var(--en);font-size:.78rem;font-weight:700;letter-spacing:.06em;color:#8a7a93;background:rgba(255,255,255,.55);padding:.3em .8em;border-radius:999px}
@keyframes memDeal{from{transform:translate(44%,6%) scale(.9) rotate(1.2deg);box-shadow:-16px 0 30px rgba(0,0,0,.3)}to{transform:none;box-shadow:0 0 0 rgba(0,0,0,0)}}
.mem--gallery .mem__shot.is-active{animation:memDeal .55s cubic-bezier(.22,.61,.36,1)}
.mem__dots{position:absolute;top:9px;left:0;right:0;display:flex;gap:7px;justify-content:center;z-index:6}
.mem__dots i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 0 3px rgba(0,0,0,.35);cursor:pointer;transition:.25s}
.mem__dots i:hover{background:rgba(255,255,255,.9)}
.mem__dots i.is-active{background:#fff;transform:scale(1.3)}
.mem--gallery .mem__over{z-index:5}.mem--gallery .mem__more{z-index:6}
/* gallery: profile is shown only via this labelled pill, so photos stay clear while cycling */
.mem__more--lbl{top:auto;right:auto;bottom:9px;left:9px;width:auto;height:auto;border-radius:999px;padding:.34em .8em;gap:.3em;font-family:var(--en);font-size:.6rem;font-weight:700;letter-spacing:.1em;cursor:pointer;opacity:.92}
.mem__more--lbl::before{content:"＋";font-size:.8rem;line-height:0}
.mem--gallery.is-open .mem__more--lbl::before{content:"×"}
.mem--gallery:hover .mem__more--lbl,.mem--gallery .mem__more--lbl:hover{opacity:1}
@media(prefers-reduced-motion:reduce){.mem--gallery .mem__shot.is-active{animation:none}}

/* ===== member cards open a centered modal (replaces tiny on-card controls) ===== */
.mem{cursor:pointer}
.mem__over,.mem__dots,.mem__more{display:none!important}
.mem__ph::after{content:"＋";position:absolute;right:8px;bottom:8px;z-index:5;width:27px;height:27px;border-radius:50%;background:rgba(255,255,255,.92);color:color-mix(in srgb,var(--mc,#FF6FA5) 60%,#3a2a3c);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.05rem;line-height:0;box-shadow:0 2px 8px rgba(0,0,0,.2);transition:transform .25s,background .25s}
.mem:hover .mem__ph::after,.mem:focus-visible .mem__ph::after{background:#fff;transform:scale(1.12)}
.mem:focus-visible{outline:3px solid color-mix(in srgb,var(--mc,#FF6FA5) 55%,#fff);outline-offset:2px}

.mmodal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;visibility:hidden;transition:opacity .28s,visibility .28s}
.mmodal.is-open{opacity:1;visibility:visible}
.mmodal__backdrop{position:absolute;inset:0;background:rgba(28,20,32,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.mmodal__panel{position:relative;z-index:1;width:min(880px,100%);max-height:90vh;overflow:auto;background:#fffdf7;border-radius:22px;border-top:5px solid var(--mc,#FF6FA5);box-shadow:0 30px 80px rgba(40,28,40,.42);display:grid;grid-template-columns:minmax(0,45%) 1fr;transform:translateY(14px) scale(.985);transition:transform .3s}
.mmodal.is-open .mmodal__panel{transform:none}
.mmodal__x{position:absolute;top:10px;right:12px;z-index:6;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.92);box-shadow:0 2px 10px rgba(0,0,0,.2);font-size:1.5rem;line-height:1;cursor:pointer;color:#5a4a52}
.mmodal__x:hover{background:#fff}
.mmodal__media{position:relative;background:linear-gradient(150deg,color-mix(in srgb,var(--mc,#FF6FA5) 22%,#fff),#f3eef6)}
.mmodal__stage{position:relative;aspect-ratio:3/4}
.mmodal__stage img{width:100%;height:100%;object-fit:cover;display:block}
.mmodal__ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#9385a0;font-family:var(--en);font-weight:700;letter-spacing:.06em;background:linear-gradient(150deg,#ffd9e8,#dcebfb)}
.mmodal__nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;border:0;background:rgba(255,255,255,.88);box-shadow:0 2px 10px rgba(0,0,0,.22);font-size:1.5rem;line-height:0;cursor:pointer;color:#5a4a52;display:flex;align-items:center;justify-content:center}
.mmodal__nav:hover{background:#fff}.mmodal__nav--prev{left:10px}.mmodal__nav--next{right:10px}
.mmodal__thumbs{display:flex;gap:8px;padding:10px;justify-content:center;flex-wrap:wrap}
.mmodal__thumbs button{width:44px;height:56px;border-radius:8px;overflow:hidden;border:2px solid transparent;padding:0;cursor:pointer;background:#eee}
.mmodal__thumbs button.is-active{border-color:var(--mc,#FF6FA5)}
.mmodal__thumbs img{width:100%;height:100%;object-fit:cover}
.mmodal__thumbs .mmodal__ph{position:static;height:100%;font-size:.5rem;padding:2px;text-align:center}
.mmodal__info{padding:clamp(22px,3.2vw,36px);display:flex;flex-direction:column;gap:.62em}
.mmodal__name{font-family:var(--en);font-size:clamp(1.4rem,3.6vw,1.9rem);font-weight:600;line-height:1.3}
.mmodal__reading{font-family:var(--en);font-size:.86rem;color:var(--ink-soft);margin-top:-.5em}
.mmodal__meta{display:flex;align-items:center;gap:8px;font-size:.95rem;color:var(--ink-soft)}
.mmodal__meta .mem__c{width:14px;height:14px}
.mmodal__tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:.35em}
.mmodal__tags span{font-size:.86rem;padding:.45em 1.05em;border-radius:999px;background:color-mix(in srgb,var(--mc,#FF6FA5) 15%,#fff);color:color-mix(in srgb,var(--mc,#FF6FA5) 52%,#3a2a3c);border:1px solid color-mix(in srgb,var(--mc,#FF6FA5) 30%,transparent)}
.mmodal__sns{display:flex;flex-wrap:wrap;gap:10px;margin-top:.7em}
.mmodal__sns a{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1.6px solid color-mix(in srgb,var(--mc,#FF6FA5) 55%,var(--ink-soft));color:color-mix(in srgb,var(--mc,#FF6FA5) 55%,var(--ink));transition:.2s}
.mmodal__sns a svg{width:19px;height:19px}
.mmodal__sns a:hover{background:color-mix(in srgb,var(--mc,#FF6FA5) 70%,var(--ink-soft));color:#fff;border-color:transparent}
@media(max-width:680px){.mmodal{padding:12px}.mmodal__panel{grid-template-columns:1fr;max-height:92vh}
  /* portrait photos were cover-cropped into a 4/3 landscape stage on mobile, cutting off the
     face. Use a portrait stage and anchor to the top so the head is always kept. */
  .mmodal__stage{aspect-ratio:3/4}.mmodal__stage img{object-position:center top}}

/* service / perk cards (video, music, audition support) */
.svcg{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,26px)}
.svc{position:relative;background:rgba(255,255,255,.78);border:1px solid rgba(58,50,44,.08);border-radius:18px;
  padding:clamp(24px,2.8vw,34px);box-shadow:0 8px 26px rgba(80,60,40,.06);transition:transform .3s,box-shadow .3s,border-color .3s}
.svc:hover{border-color:color-mix(in srgb,var(--cc,#F5921E) 35%,transparent);box-shadow:0 16px 38px color-mix(in srgb,var(--cc,#F5921E) 14%,rgba(80,60,40,.08))}
.svc__no{font-family:var(--en);font-weight:800;font-size:1.5rem;color:color-mix(in srgb,var(--cc,#F5921E) 55%,#e6dccf)}
.svc h3{font-family:var(--en);font-weight:600;font-size:1.16rem;margin:.15em 0 .4em}
.svc p{color:var(--ink-soft);font-size:.92rem}

/* works filter tabs (video.html) */
.vtabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(18px,2.5vw,28px)}
.vtab{font-family:var(--en);font-weight:700;font-size:.82rem;letter-spacing:.03em;padding:.5em 1.1em;border-radius:999px;cursor:pointer;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);color:#e9ddd1;transition:.2s}
.vtab:hover{background:rgba(255,255,255,.18)}
.vtab.is-active{background:#fff;color:#241f1b;border-color:#fff}

/* numbered flow */
.flow{list-style:none;counter-reset:f;display:grid;gap:14px}
.flow li{position:relative;background:rgba(255,255,255,.9);border-radius:16px;padding:20px 22px 20px 68px;box-shadow:0 10px 30px rgba(210,150,90,.12);counter-increment:f}
.flow li::before{content:counter(f,decimal-leading-zero);position:absolute;left:20px;top:50%;transform:translateY(-50%);font-family:var(--en);font-weight:800;font-size:1.3rem;color:var(--cc,var(--orange))}
.flow h3{font-family:var(--en);font-weight:600;font-size:1.04rem;margin-bottom:.2em}
.flow p{color:var(--ink-soft);font-size:.9rem}
@media(min-width:760px){.flow{grid-template-columns:repeat(4,1fr)}.flow--3{grid-template-columns:repeat(3,1fr)}
  .flow li{padding:52px 18px 18px}.flow li::before{top:18px;left:18px;transform:none}}

/* requirements table + faq */
.rtable{width:100%;border-collapse:collapse;background:rgba(255,255,255,.9);border-radius:16px;overflow:hidden;box-shadow:0 12px 34px rgba(210,150,90,.12)}
.rtable th,.rtable td{text-align:left;padding:16px 20px;border-top:1px solid rgba(120,90,60,.12);font-size:.95rem;vertical-align:top}
.rtable th{width:120px;background:color-mix(in srgb,var(--cc,#FF6FA5) 10%,#fff);font-weight:700;color:color-mix(in srgb,var(--cc,#FF6FA5) 70%,#4a3a2c);white-space:nowrap}
.rtable tr:first-child th,.rtable tr:first-child td{border-top:0}
.faq{display:grid;gap:10px}
.faq details{background:rgba(255,255,255,.9);border-radius:14px;box-shadow:0 10px 28px rgba(210,150,90,.1);overflow:hidden}
.faq summary{cursor:pointer;padding:16px 46px 16px 20px;font-weight:700;font-size:.96rem;position:relative;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-family:var(--en);font-size:1.3rem;color:var(--cc,var(--orange));transition:transform .25s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq__a{padding:0 20px 18px;color:var(--ink-soft);font-size:.92rem}

/* contact form */
.cgrid{display:grid;grid-template-columns:1.3fr .9fr;gap:clamp(28px,4vw,52px);align-items:start}
.cform{display:grid;gap:16px}
.field{display:grid;gap:6px}
.field label{font-weight:700;font-size:.9rem;display:flex;align-items:center;gap:8px}
.req{font-size:.66rem;font-weight:700;color:#fff;background:var(--pink);padding:.18em .6em;border-radius:999px}
.field input,.field select,.field textarea{width:100%;font:inherit;padding:.72em .9em;border:1.6px solid rgba(120,90,60,.2);border-radius:12px;background:rgba(255,255,255,.92);color:var(--ink);transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:148px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--cc,var(--pink));box-shadow:0 0 0 3px color-mix(in srgb,var(--cc,var(--pink)) 18%,transparent)}
.cside{background:rgba(255,255,255,.9);border-radius:20px;padding:clamp(24px,3vw,34px);box-shadow:0 14px 40px rgba(210,150,90,.14)}
.cside h3{font-family:var(--en);font-weight:600;font-size:1.16rem;margin-bottom:.5em;color:var(--ink)}
.cside h3:not(:first-child){margin-top:1.4em}
.cside .info p{font-size:.92rem;color:var(--ink-soft)}
.cside .info a{color:var(--orange-d)}
.cside dl{display:grid;grid-template-columns:auto 1fr;gap:0 14px}
.cside dt{font-weight:700;font-size:.82rem;padding:8px 0;border-top:1px solid rgba(120,90,60,.12)}
.cside dd{font-size:.82rem;color:var(--ink-soft);padding:8px 0;border-top:1px solid rgba(120,90,60,.12)}
.cnote{font-size:.8rem;color:var(--ink-soft)}

/* footer page nav */
.ft__nav{display:flex;flex-wrap:wrap;gap:8px 22px;justify-content:center;margin-top:clamp(34px,5vw,52px);padding-top:24px;border-top:1px solid rgba(255,255,255,.1)}
.ft__nav a{font-family:var(--en);font-weight:600;font-size:.8rem;letter-spacing:.06em;color:#c9bcb0;transition:color .2s}
.ft__nav a:hover{color:var(--orange)}

/* studio: coming soon shell */
.soon{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.55em;padding:clamp(40px,6vw,74px) 24px;border-radius:26px;
  background:rgba(255,255,255,.85);border:2px dashed color-mix(in srgb,var(--cc,#33C892) 42%,transparent)}
.soon__b{font-family:var(--en);font-weight:800;letter-spacing:.1em;color:var(--cc,#33C892);font-size:1rem}
.soon h2{font-family:var(--en);font-weight:600;font-size:clamp(1.6rem,4.5vw,2.4rem)}
.soon p{color:var(--ink-soft);max-width:56ch}
.specg{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:clamp(20px,3vw,30px)}
.spec{background:rgba(255,255,255,.82);border-radius:16px;padding:24px;box-shadow:0 10px 28px rgba(210,150,90,.1)}
.spec__t{display:flex;align-items:center;gap:10px;margin-bottom:.4em}
.spec__t b{font-family:var(--mincho);font-weight:700;font-size:1.05rem}
.spec__soon{font-family:var(--en);font-size:.64rem;font-weight:700;letter-spacing:.08em;padding:.2em .6em;border-radius:999px;background:color-mix(in srgb,var(--cc,#33C892) 16%,#fff);color:color-mix(in srgb,var(--cc,#33C892) 70%,#3a4a40)}
.spec p{color:var(--ink-soft);font-size:.88rem}

/* restructure responsive */
@media(max-width:900px){
  .nav__drop{width:100%;flex-direction:column;align-items:center;text-align:center}
  .nav__dtop{font-size:1.1rem;justify-content:center}
  .nav__dtop::before{transition:transform .3s ease}
  .nav__drop.is-open .nav__dtop::before{transform:rotate(180deg)}
  /* accordion: TALENT sub-menu stays collapsed until tapped (.is-open toggled by JS) */
  .nav__menu{position:static;transform:none;visibility:visible;background:none;border:0;box-shadow:none;backdrop-filter:none;align-items:center;
    max-height:0;opacity:0;overflow:hidden;padding:0;transition:max-height .32s ease,opacity .26s ease,padding .32s ease}
  .nav__drop:hover .nav__menu,.nav__drop:focus-within .nav__menu{transform:none}
  .nav__drop.is-open .nav__menu{max-height:180px;opacity:1;padding:8px 0 2px}
  .nav__menu a{font-size:1rem;opacity:.85}
  .about-grid{grid-template-columns:1fr}
  .grphead{grid-template-columns:1fr}
  .memg{grid-template-columns:repeat(3,1fr)}
  .svcg{grid-template-columns:1fr 1fr}
  .cgrid{grid-template-columns:1fr}
}
@media(max-width:760px){.hub{grid-template-columns:1fr}}
@media(max-width:640px){.specg{grid-template-columns:1fr}}
@media(max-width:560px){
  .svcg{grid-template-columns:1fr}
  .memg{grid-template-columns:repeat(2,1fr)}
  .rtable th,.rtable td{display:block;width:auto}
  .rtable th{border-radius:0}.rtable td{padding-top:0;border-top:0}
}