/* =====================================================
   THEME — MORNING HAZE (朝もやパステル) v2
   カラールール: NERUKO = ピンク / Asamoya = ブルー
   v2: ブルーの主張を全体的に少し抑えた調整版
   使い方: 各HTMLの style.css の「後」に読み込む
   <link rel="stylesheet" href="theme.css?v=1">
   ===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@300;400;500&display=swap');

:root{
    --color-bg:#FBF7F0;
    --neruko-pink:#E0709B;
    --asamoya-blue:#5F83D8;
    /* 元の #82a8ff より彩度を落としたブルー（リンクhover等の主張を弱める） */
    --color-accent-1:#95ACDF;
    --font-jp:'Zen Maru Gothic','Noto Sans JP',sans-serif;
}

/* --- ゆっくり漂うパステルの霞（ブルー側の濃度を下げた） --- */
body{ position:relative; }
body::before{
    content:'';
    position:fixed; inset:-20%;
    z-index:-1; pointer-events:none;
    background:
        radial-gradient(40% 35% at 18% 22%, rgba(255,156,189,.30), transparent 70%),
        radial-gradient(38% 32% at 82% 30%, rgba(130,168,255,.18), transparent 70%),
        radial-gradient(45% 40% at 50% 88%, rgba(255,180,200,.14), transparent 70%);
    filter:blur(60px);
    animation:hazeDrift 26s ease-in-out infinite alternate;
}
@keyframes hazeDrift{
    from{ transform:translate3d(-2%,-1%,0) scale(1); }
    to  { transform:translate3d(2%,2%,0)   scale(1.06); }
}
@media (prefers-reduced-motion: reduce){
    body::before{ animation:none; }
}

/* --- Hero：Neruko(左=ピンク) / Asamoya(右=ブルー)。空の青みも控えめに --- */
.hero{
    background:
        url('images/hero_bg_clouds.png') center/cover no-repeat,
        linear-gradient(180deg,#FDEFF5 0%, #F0F3FB 55%, #FBF7F0 100%);
}
.hero::before{
    background:linear-gradient(180deg, rgba(251,247,240,.10), rgba(251,247,240,.55));
}
.hero-title{
    font-weight:400;
    background:linear-gradient(90deg, var(--neruko-pink) 0%, #B57BC0 50%, var(--asamoya-blue) 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

/* --- セクションタイトル：ピンク→ブルーの小さなバー --- */
.section-title{
    color:var(--color-text);
    letter-spacing:.45em;
    padding-bottom:1.2rem;
    position:relative;
}
.section-title::after{
    content:'';
    position:absolute; left:50%; bottom:0;
    transform:translateX(-50%);
    width:44px; height:3px; border-radius:3px;
    background:linear-gradient(90deg,var(--color-accent-2),var(--color-accent-1));
}

/* --- ヘッダー：すりガラス --- */
.site-header.scrolled{
    background:rgba(251,247,240,.75);
    backdrop-filter:blur(16px) saturate(1.4);
    -webkit-backdrop-filter:blur(16px) saturate(1.4);
}

/* --- カード類：角丸。影は青→ニュートラルに変更 --- */
.cd-jacket{
    border-radius:16px;
    box-shadow:0 10px 30px rgba(45,45,60,.10);
}
.cd-jacket:hover{
    box-shadow:0 16px 40px rgba(255,156,189,.25);
}
.gallery-item{ border-radius:14px; }
.goods-carousel-item{ border-radius:16px; }

/* --- NEWS --- */
.news-category{
    background:linear-gradient(90deg,rgba(255,156,189,.18),rgba(130,168,255,.12));
    border-radius:999px;
    color:#555;
    letter-spacing:.15em;
}
.news-item:hover{ color:var(--neruko-pink); }

/* --- ボタン類：ピル型＋ホバーでピンク→ブルー --- */
.more-btn,
.music-btn,
.contact-form button{
    border-radius:999px;
    border:1px solid rgba(17,17,17,.25);
}
.more-btn:hover,
.music-btn:hover,
.contact-form button:hover{
    background:linear-gradient(90deg,var(--color-accent-2),var(--color-accent-1));
    border-color:transparent;
    color:#fff;
}

/* --- PROFILE：nerukoはピンク / Asamoyaはブルー --- */
#profile .profile-block:nth-of-type(1) h3{
    color:var(--neruko-pink);
}
#profile .profile-block:nth-of-type(1) .creative-producer-title{
    border-bottom-color:rgba(255,156,189,.55);
}
#profile .profile-block:nth-of-type(1) img{
    box-shadow:0 8px 30px rgba(255,156,189,.28) !important;
}
#profile .profile-block:nth-of-type(2) h3{
    color:var(--asamoya-blue);
    border-bottom-color:rgba(130,168,255,.45) !important;
}
#profile .profile-block:nth-of-type(2) img{
    box-shadow:0 8px 30px rgba(130,168,255,.22) !important;
}

/* --- フッター：ロゴもピンク→ブルー --- */
.footer-big-logo{
    background:linear-gradient(90deg,var(--neruko-pink),var(--asamoya-blue));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}
.sns-badge{
    border:none;
    background:linear-gradient(90deg,rgba(255,156,189,.20),rgba(130,168,255,.14));
}

/* --- ジャケットの再生ヒント ---
   元CSSのバグ修正: hover時の transform:scale() が translate(-50%,-50%) を
   上書きして中央からズレていたので、両方を指定し直す */
.play-hint{
    transform:translate(-50%,-50%);
    background:rgba(255,255,255,.85);
    color:#555;
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    box-shadow:0 4px 16px rgba(0,0,0,.18);
    padding:10px 22px;
    gap:.9rem;
}
.play-hint svg{
    width:20px;
    height:20px;
    margin-left:0;
}
.cd-jacket:hover .play-hint{
    transform:translate(-50%,-50%) scale(1.06);
    background:rgba(255,255,255,.95);
    color:var(--neruko-pink);
}

/* --- ギャラリーのフェード（インラインstyleを上書き） --- */
#gallery-fade-overlay{
    background:linear-gradient(to bottom, rgba(251,247,240,0) 0%, rgba(251,247,240,1) 90%) !important;
}