/* ============================================================
   PIVOT AI Kids — ai-kids.css (v3.0)
   完全クリーンアップ：基本リセットとモックアップのトグル・レスポンシブ制御
   ============================================================ */

/* ---- Reset & Base ---------------------------------------- */
html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    font-family: 'Noto Sans JP', 'Hiragino Sans', sans-serif;
    background: #FFFFFF;
    color: #171512;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

* {
    box-sizing: border-box;
}

a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: #06C755;
}

button {
    font-family: inherit;
    cursor: pointer;
    outline: none;
}

input, select, textarea {
    font-family: inherit;
}

/* ---- FAQ アコーディオン開閉アニメーション ------------------ */
.kids-faq-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s cubic-bezier(0.16, 1, 0.3, 1), padding 0.35s ease;
    padding: 0 22px 0;
}

.kids-faq-content.is-open {
    max-height: 350px; /* 十分な高さ */
    padding: 0 22px 20px;
}

/* ---- テーマ選択ボタンのアクティブホバーアニメーション ------ */
.theme-select-btn {
    transition: all 0.2s ease;
}

/* ---- スムーズなフェードインアニメーション用 ---------------- */
@keyframes float01 {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

/* ============================================================
   RESPONSIVE LAYOUTS (モックアップ仕様)
   ============================================================ */
@media (max-width: 899px) {
    /* デスクトップナビ非表示 */
    .desktop-nav {
        display: none !important;
    }

    /* ハンバーガー表示 */
    .hamburger-btn {
        display: flex !important;
    }

    /* スマホ固定CTA表示 */
    .mobile-cta-btn {
        display: block !important;
    }

    /* Visionセクション */
    .kids-vision-grid {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }

    /* Themesセクション */
    .kids-themes-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    }

    /* Learning Steps */
    .kids-steps-row {
        grid-template-columns: 1fr !important;
        gap: 32px !important;
    }
    
    .kids-step-divider {
        display: none !important;
    }

    .kids-step-block {
        padding: 0 !important;
        border-bottom: 1px solid #EDEAE2;
        padding-bottom: 24px !important;
    }
    
    .kids-step-block:last-child {
        border-bottom: none;
        padding-bottom: 0 !important;
    }
}

/* ============================================================
   PRINT MEDIA STYLES (印刷・PDF出力時の表示崩れ・二重ヘッダーの防止)
   ============================================================ */
@media print {
    header, 
    .mobile-cta-btn,
    #kids-side-menu {
        display: none !important;
    }
    body {
        background: #FFFFFF !important;
        color: #000000 !important;
    }
}
