@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/


/* style.css */
#splash-screen {
  position: fixed;
  inset: 0;
  background: #000; /* 完全な黒 */
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

#starry-sky-canvas {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.splash-logo {
  width: 80%;
  max-width: 480px;
  height: auto;
  z-index: 2;
  opacity: 0;
  transform: scale(0.85);
  filter: blur(12px) brightness(1.5);
  /* transitionにメリハリ（expo）をつける */
  transition: opacity 1.5s ease-out, transform 2s cubic-bezier(0.19, 1, 0.22, 1), filter 1.5s ease-out;
  pointer-events: none;
}

/* ロゴ表示時：少しだけ呼吸するように揺らす */
.splash-logo.is-active {
  opacity: 1;
  transform: scale(1);
  filter: blur(0) brightness(1);
  animation: logoPulse 4s ease-in-out infinite 1.5s;
}

@keyframes logoPulse {
  0%, 100% { transform: scale(1); filter: drop-shadow(0 0 0px rgba(196,167,119,0)); }
  50% { transform: scale(1.02); filter: drop-shadow(0 0 15px rgba(196,167,119,0.3)); }
}

/* サイトへの接続：白へのホワイトアウト */
#splash-screen.fade-out {
  opacity: 0;
  transition: opacity 0.6s ease-in; /* ホワイトアウトの残光を少し残す */
}

}/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}