/* =====================================
   建てるのなら、木造で - 美化CSS
   ===================================== */

/* PDFガイドカード全体 */
.project-card[style*="border: 2px solid #d4a574"] {
    position: relative;
    overflow: visible;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.project-card[style*="border: 2px solid #d4a574"]:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 45px rgba(45, 80, 22, 0.25) !important;
    border-color: #2d5016 !important;
}

/* 画像ホバーエフェクト */
.project-card[style*="border: 2px solid #d4a574"] .project-photo {
    transition: transform 0.5s ease, filter 0.4s ease;
}

.project-card[style*="border: 2px solid #d4a574"]:hover .project-photo {
    transform: scale(1.05);
    filter: brightness(1.05);
}

/* 無料ダウンロードバッジのアニメーション */
.project-card[style*="border: 2px solid #d4a574"] div[style*="position: absolute"][style*="left: 1rem"] {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(212, 165, 116, 0.7);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 0 0 10px rgba(212, 165, 116, 0);
    }
}

/* タイトルのアニメーション */
.project-card[style*="border: 2px solid #d4a574"] h3 {
    transition: color 0.3s ease;
}

.project-card[style*="border: 2px solid #d4a574"]:hover h3 {
    color: #1a3009 !important;
}

/* PDFを開くボタンのエンハンス */
.project-card[style*="border: 2px solid #d4a574"] .gallery-badge {
    position: relative;
    display: inline-block;
    overflow: hidden;
    transition: all 0.3s ease;
}

.project-card[style*="border: 2px solid #d4a574"] .gallery-badge::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    transition: left 0.5s ease;
}

.project-card[style*="border: 2px solid #d4a574"]:hover .gallery-badge {
    transform: scale(1.05);
    box-shadow: 0 6px 20px rgba(45, 80, 22, 0.4) !important;
}

.project-card[style*="border: 2px solid #d4a574"]:hover .gallery-badge::before {
    left: 100%;
}

/* 発行元バッジのホバーエフェクト */
.project-card[style*="border: 2px solid #d4a574"] a[style*="border: 2px solid #2d5016"] {
    position: relative;
    overflow: hidden;
}

.project-card[style*="border: 2px solid #d4a574"] a[style*="border: 2px solid #2d5016"]:hover {
    background: linear-gradient(135deg, #2d5016 0%, #1a3009 100%) !important;
    color: white !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(45, 80, 22, 0.3) !important;
}

/* アイコンのアニメーション */
.project-card[style*="border: 2px solid #d4a574"]:hover .fa-book-open {
    animation: bookOpen 0.6s ease;
}

@keyframes bookOpen {
    0%, 100% { transform: rotateY(0deg); }
    50% { transform: rotateY(20deg); }
}

.project-card[style*="border: 2px solid #d4a574"]:hover .fa-check-circle {
    animation: checkBounce 0.5s ease;
}

@keyframes checkBounce {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.2); }
}

/* フィーチャーリストのスタイルエンハンス */
.project-card[style*="border: 2px solid #d4a574"] ul.project-features li {
    transition: all 0.3s ease;
}

.project-card[style*="border: 2px solid #d4a574"]:hover ul.project-features li {
    transform: translateX(5px);
}

/* 発行元セクションの背景アニメーション */
.project-card[style*="border: 2px solid #d4a574"] > a > div[style*="project-content"] > div[style*="margin-top: 1.5rem"] {
    transition: background 0.4s ease;
}

.project-card[style*="border: 2px solid #d4a574"]:hover > a > div[style*="project-content"] > div[style*="margin-top: 1.5rem"] {
    background: linear-gradient(135deg, #f0f8f0 0%, #ffffff 100%) !important;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .project-card[style*="border: 2px solid #d4a574"]:hover {
        transform: translateY(-4px);
    }
}

/* アクセシビリティ: フォーカス時のスタイル */
.project-card[style*="border: 2px solid #d4a574"] a:focus {
    outline: 3px solid #2d5016;
    outline-offset: 4px;
}

/* プリント時の最適化 */
@media print {
    .project-card[style*="border: 2px solid #d4a574"] {
        box-shadow: none !important;
        border: 2px solid #2d5016 !important;
    }
}
