/* ============================================================
   美名家 — 上品なスクロールモーション（広島っ子 top-anim.css の技術を踏襲・臙脂×金トーンに調整）
   ・スクロールリビール（下からフェードアップ） ・ヒーローの微ズーム ・SCROLLインジケーター（中央）
   のみを実装する。ghost watermark・カード/ボタンの過剰なホバー演出などの装飾は追加しない
   （2026-07-24に社長指示で一度撤去した原型デザイン方針を踏まえ、最小限・上品な演出に留める）。
   prefers-reduced-motion: reduce では全アニメーションを停止する。
   ============================================================ */

/* ---- スクロールリビール：JS(top-anim.js)が対象要素へ .anim-reveal を付与し、
        画面内に入ったら .in を付与してフェードアップさせる ---- */
.anim-reveal{
  opacity:0;transform:translateY(22px);
  transition:opacity .6s cubic-bezier(.16,.75,.2,1),transform .6s cubic-bezier(.16,.75,.2,1);
  transition-delay:var(--d,0ms);
  will-change:opacity,transform;
}
.anim-reveal.in{opacity:1;transform:none}

/* ---- ヒーロー：ごくゆるやかな微ズーム（ケンバーンズ風・控えめ）
        既存の site.js が .hero-slide に .is-active を出し入れするクロスフェード方式のため、
        アニメーションではなく transition ベースで実装し、タイミング非依存で自然に効かせる ---- */
@media (prefers-reduced-motion: no-preference){
  .hero-slide{
    transform:scale(1);
    transition:opacity 1.4s ease, transform 6.2s ease-out;
  }
  .hero-slide.is-active{transform:scale(1.055)}
}

/* ---- SCROLL インジケーター：ヒーロー下部・中央固定 ---- */
.scrollcue{
  position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:9px;
  font-family:'Zen Maru Gothic',sans-serif;font-size:10.5px;letter-spacing:.3em;color:rgba(255,255,255,.8);
  pointer-events:none;
}
.scrollcue .ln{width:1px;height:24px;background:linear-gradient(180deg,rgba(201,162,75,.95),rgba(201,162,75,0))}
@media (prefers-reduced-motion: no-preference){
  .scrollcue{animation:mnCueBob 2.4s ease-in-out infinite alternate}
}
@keyframes mnCueBob{from{transform:translate(-50%,-6px)}to{transform:translate(-50%,6px)}}
@media (max-width:1023px){
  .scrollcue{bottom:14px;font-size:9.5px}
  .scrollcue .ln{height:18px}
}

@media (prefers-reduced-motion: reduce){
  .anim-reveal{opacity:1!important;transform:none!important;transition:none!important}
  .hero-slide{transition:opacity 1.4s ease!important;transform:none!important}
  .scrollcue{animation:none!important}
}

/* 2026-07-28 SPはリビール移動量を12pxに抑える */
@media (max-width:767px){
  .anim-reveal{transform:translateY(12px)}
}

/* 2026-07-26 セクション英字ラベルに流れる光沢＋装飾ドリフト（全ページ共通・下層も反映） */
.sec-head .en{
  background-image:linear-gradient(100deg, currentColor 0%, currentColor 42%, rgba(255,255,255,.9) 50%, currentColor 58%, currentColor 100%);
  background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:var(--ck-maroon,#6b1100);
  animation:mnSheen 5s linear infinite;
}
@keyframes mnSheen{from{background-position:210% 0}to{background-position:-110% 0}}
/* セクション見出しの下線がスッと伸びる */
.sec-head h2{position:relative;}
.sec-head.anim-reveal.is-inview h2::after{content:"";position:absolute;left:50%;bottom:-10px;height:2px;width:0;background:var(--ck-maroon,#6b1100);transform:translateX(-50%);animation:mnLine .7s .25s ease forwards}
@keyframes mnLine{to{width:44px}}
@media (prefers-reduced-motion:reduce){
  .sec-head .en{animation:none;-webkit-text-fill-color:currentColor}
  .sec-head.anim-reveal.is-inview h2::after{animation:none;width:44px}
}