/*
Theme Name: White Wolf Theme
Author: Gemini
Description: 株式会社ホワイトウルフの公式ホームページ用カスタムテーマ
Version: 1.0
*/

/* index.html の <style> タグ内の内容をここに記述します */
:root {
    --primary: #1a1a1a;
    --accent: #5e5e5e;
}
body {
    font-family: 'Noto Sans JP', sans-serif;
    color: var(--primary);
    background-color: #fff;
    scroll-behavior: smooth;
}
.font-en { font-family: 'Montserrat', sans-serif; }

.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.nav-link {
    position: relative;
    padding-bottom: 2px;
}
.nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: currentColor;
    transition: width 0.3s ease;
}
.nav-link:hover::after {
    width: 100%;
}

.hero-bg {
    /* 画像と黒いフィルターを重ねる */
    background-image: 
        linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), 
        url('http://whitewolf.jp/wp-content/uploads/2026/02/top_1.jpg');
    
    /* 分けて記述することでSafariの解釈ミスを防ぐ */
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    
    /* 高さを確保 */
    height: 100vh;
}

.parallax-section {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.logo-container img {
    height: 40px;
    width: auto;
    display: block;
}

.image-card {
    overflow: hidden;
    position: relative;
}
.image-card img {
    transition: transform 0.8s ease;
}
.image-card:hover img {
    transform: scale(1.05);
}

.bg-overlay {
    background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%);
}