/* ✦ 控えめな単一スパークル装飾 ＋ 裏サイトへの隠しリンク
   絵文字✨(3連星)ではなく単一グリフ✦を使用。色味は目立たないよう低彩度・低不透明度。 */

.hero, .section, .about, .access, .site-footer, .dish-grid, .dish{ position:relative; }

/* 装飾スパークル（クリック不可・うっすら明滅） */
.spark{
  position:absolute; z-index:4; pointer-events:none; user-select:none;
  font-size:14px; line-height:1;
  color:rgba(178,146,98,.6);                  /* 控えめな金（見えるよう不透明度up） */
  text-shadow:0 0 7px rgba(178,146,98,.38);
  animation:sparkTw 6s ease-in-out infinite;
}
.spark.sm{ font-size:10px; }
.spark.lg{ font-size:18px; }
.spark--light{                                /* 暗いヒーロー/フッター用 */
  color:rgba(248,242,230,.55);
  text-shadow:0 0 9px rgba(255,238,205,.32);
}
@keyframes sparkTw{ 0%,100%{ opacity:.42 } 50%{ opacity:.82 } }
@media (prefers-reduced-motion:reduce){ .spark{ animation:none; } }

/* 裏サイトへの隠しリンク：1つめの画像の右端・画像の縦中央（＝1つめと2つめの画像の間） */
.dish .ph:has(.secret-spark){ overflow:visible; } /* 星が画像枠の外(gutter)へはみ出せるように */
.secret-spark{
  position:absolute; z-index:7;
  top:50%; right:calc(clamp(20px,2vw,34px) * -0.5);   /* 画像の縦中央／右の隙間中央 */
  transform:translate(50%,-50%);
  font-size:15px; line-height:1; text-decoration:none;
  color:rgba(176,128,96,.32);                 /* ほぼ装飾の金。ごく僅かに暖色＝近づかないと分からない */
  text-shadow:0 0 5px rgba(160,110,84,.18);
  cursor:pointer; transition:color .25s, text-shadow .25s, transform .25s;
  animation:sparkTw 6s ease-in-out infinite;
}
.secret-spark:hover, .secret-spark:focus-visible{
  color:rgba(150,72,60,.72);                  /* ホバーで少しだけ濃いテラコッタ */
  text-shadow:0 0 10px rgba(150,72,60,.4);
  transform:translate(50%,-50%) scale(1.2); outline:none;
}
/* スマホもPCと同じ見え方にする（専用の上書きを廃止＝色・サイズ・明滅・位置を共通化） */