.cover{min-height:100svh;display:flex;flex-direction:column;justify-content:center;
  padding-block:clamp(72px,12vh,140px);overflow:hidden;position:relative;}
.cover-top{position:absolute;top:0;left:0;right:0;padding:22px var(--gut);display:flex;
  justify-content:space-between;font-family:var(--mono);font-size:.7rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--mist);z-index:4;}
.cover-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:clamp(24px,5vw,72px);align-items:center;position:relative;z-index:1;}
.hero-col{will-change:transform,opacity;}
.eyebrow-2{flex-direction:column;align-items:flex-start;line-height:1.85;}
.eyebrow-2::before{display:none;}
.eb-rule{width:34px;height:1px;background:var(--teal-500);transform-origin:left center;will-change:transform;}
.eb-text{display:block;}
.wordmark{font-family:var(--logotype);font-style:italic;font-weight:400;font-size:clamp(5rem,20vw,13.5rem);
  line-height:.96;letter-spacing:.005em;margin:0;color:var(--ink);will-change:transform;}
/* ワードマークのマスク立ち上げ：内側を overflow:hidden の枠でクリップ。
   padding＋負marginで斜体グリフのはみ出しを保護しつつレイアウトは維持 */
.wm-mask{display:inline-block;overflow:hidden;vertical-align:bottom;
  padding:.14em .1em .2em;margin:-.14em -.1em -.2em;}
.wm-in{display:inline-block;will-change:transform;}

/* ロゴ：小さめ＋余白＋ゆるい浮遊＋柔らかい影 */
.portrait-stack{position:relative;justify-self:center;width:min(248px,58vw);aspect-ratio:4/5;
  will-change:transform;margin:clamp(10px,3vw,40px);}
.portrait-float{position:absolute;inset:0;will-change:transform,opacity;opacity:0;
  animation:portraitIn 1.2s cubic-bezier(.22,1,.36,1) .15s forwards;}
.p-slab{position:absolute;left:-11%;top:7%;width:100%;height:100%;opacity:.92;
  background:linear-gradient(150deg,var(--teal-300),var(--teal-700));
  clip-path:polygon(0 9%,100% 0,100% 91%,0 100%);will-change:transform;}
.p-window{position:absolute;right:-7%;top:0;width:100%;height:100%;
  background:url("../../assets/logo.jpg") center/cover no-repeat;
  clip-path:polygon(0 6%,100% 0,100% 94%,0 100%);
  filter:drop-shadow(0 26px 42px rgba(39,86,90,.45)) drop-shadow(0 10px 18px rgba(39,86,90,.3));
  will-change:transform;}
@keyframes portraitIn{from{opacity:0;transform:translateY(34px) scale(.94) rotate(1.6deg);}to{opacity:1;transform:none;}}

/* スクロール誘導：落ちるティールの線＋弾むシェブロン */
/* スクロール誘導：中央配置・流れる二段の線＋弾むシェブロン */
.scrollcue{position:absolute;left:50%;bottom:clamp(16px,3.5vh,40px);transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:.8rem;z-index:4;}
.sc-label{font-family:var(--mono);font-size:.66rem;letter-spacing:.42em;text-transform:uppercase;color:var(--mist);text-indent:.42em;}
.sc-track{position:relative;width:1px;height:62px;overflow:hidden;
  background:linear-gradient(180deg,var(--line),rgba(226,235,235,0));}
.sc-dot{position:absolute;left:0;top:-26px;width:1px;height:26px;
  background:linear-gradient(180deg,transparent,var(--teal-500));animation:scDown 2s cubic-bezier(.65,0,.35,1) infinite;}
.sc-dot2{animation-delay:1s;}
.sc-chev{width:9px;height:9px;border-right:1.4px solid var(--teal-500);border-bottom:1.4px solid var(--teal-500);
  transform:rotate(45deg);animation:scBounce 2s ease-in-out infinite;}
@keyframes scDown{0%{top:-26px;}64%{top:62px;}100%{top:62px;}}
@keyframes scBounce{0%,100%{transform:rotate(45deg) translate(-2px,-2px);opacity:.4;}50%{transform:rotate(45deg) translate(2px,2px);opacity:1;}}

/* ===== 初回ロードの映画的イントロ =====
   html.intro = 描画前に付与した初期(隠し)状態。html.intro.intro-go = 再生(可視へ遷移)。
   intro が無い時（reduce / JS無効 / 失敗）は通常の可視状態＝安全側。 */
html.intro .cover-top{opacity:0;transform:translateY(-8px);}
html.intro .eb-rule{transform:scaleX(0);}
html.intro .eb-text{opacity:0;transform:translateY(10px);}
html.intro .wm-in{transform:translateY(108%);}
html.intro .portrait-float{animation:none;opacity:0;transform:translateY(40px) scale(.92) rotate(1.8deg);}
html.intro .p-window{clip-path:polygon(0 48%,100% 43%,100% 57%,0 52%);filter:drop-shadow(0 0 0 rgba(39,86,90,0));}
html.intro .scrollcue{opacity:0;}

html.intro.intro-go .cover-top{opacity:1;transform:none;transition:opacity .7s ease .1s,transform .7s var(--ease-quint) .1s;}
html.intro.intro-go .eb-rule{transform:scaleX(1);transition:transform .7s var(--ease-quint) .2s;}
html.intro.intro-go .eb-text{opacity:1;transform:none;transition:opacity .7s ease .42s,transform .8s var(--ease-quint) .42s;}
html.intro.intro-go .wm-in{transform:translateY(0);transition:transform 1s var(--ease-quint) .52s;}
html.intro.intro-go .portrait-float{opacity:1;transform:none;transition:opacity .8s ease .5s,transform 1.1s var(--ease-quint) .5s;}
html.intro.intro-go .p-window{clip-path:polygon(0 6%,100% 0,100% 94%,0 100%);
  filter:drop-shadow(0 26px 42px rgba(39,86,90,.45)) drop-shadow(0 10px 18px rgba(39,86,90,.3));
  transition:clip-path 1s var(--ease-quint) .72s,filter .9s ease .82s;}
html.intro.intro-go .scrollcue{opacity:1;transition:opacity .7s ease 1.45s;}

@media(max-width:760px){
  .cover{justify-content:flex-start;padding-top:clamp(82px,13vh,120px);padding-bottom:110px;}
  .cover-grid{grid-template-columns:1fr;}
  .portrait-stack{order:-1;margin-bottom:8px;width:min(212px,52vw);}
  /* モバイルは肩書き・ワードマークを中央寄せ（ポートレートが中央なので揃える） */
  .hero-col{text-align:center;}
  .eyebrow-2{align-items:center;}
  .scrollcue{bottom:16px;gap:.5rem;}
  .sc-track{height:46px;}
}
@media(prefers-reduced-motion:reduce){
  .sc-dot,.sc-chev{animation:none;}
  .portrait-float{animation:none;opacity:1;}
  /* イントロは無効化＝最初から可視（万一 intro が付いても安全側） */
  html.intro .cover-top,html.intro .eb-text,html.intro .wm-in,
  html.intro .portrait-float,html.intro .scrollcue{opacity:1;transform:none;}
  html.intro .eb-rule{transform:scaleX(1);}
  html.intro .p-window{clip-path:polygon(0 6%,100% 0,100% 94%,0 100%);
    filter:drop-shadow(0 26px 42px rgba(39,86,90,.45)) drop-shadow(0 10px 18px rgba(39,86,90,.3));}
}