/*
Theme Name: 美骨パーソナルトレーニングJe me design
Theme URI: https://kukui-shinkyu.com
Author: 株式会社WINQER
Author URI: https://winqer.co.jp
Description: 美骨パーソナルトレーニングJe me designのオリジナルWordPressテーマ
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kukui-shinkyu
*/

/*
   美骨パーソナルトレーニングJe me design カスタムテーマ
   Tailwind CSS (CDN) + カスタムCSS で構成
   制作: 株式会社WINQER
*/

:root {
    /* ベースカラー */
    --text: #4a3b3b; /* 真っ黒ではなく、柔らかいダークブラウン */
    --background: #fffdfd; /* ほんのり温かみのある白 */
    
    /* ピンク系テーマカラー */
    --primary: #f3c4d7; /* メインの薄いピンク */
    --secondary: #d7ccc8; /* サブで使える上品なグレージュ/ベージュ */
    --accent: #d81b60; /* 引き締めるための濃いめのローズピンク */
    
    /* テキスト・リンク・その他 */
    --text-light: #fffafa;
    --text-dark: #3e2723;
    --border: #f4e8eb; /* ピンクがかった薄いグレー */
    --shadow: rgba(100, 50, 60, 0.08); /* 影も少し暖色に */
    --link: #e57373; /* リンクは少し目立つコーラルピンク */
    --link-hover: #c62828;
    
    /* アラート用 */
    --success: #81c784;
    --error: #e57373;
    --warning: #ffb74d;
    --info: #4dd0e1;
    
    /* タイトル・段落 */
    --heading: #5d4037; /* 見出し用ブラウン */
    --paragraph: #6d5b5b; /* 本文用 */
    
    /* 背景色バリエーション */
    --bg-light: #fdf4f6; /* 薄いピンクの背景エリア用 */
    --bg-dark: #4a3b3b;
    
    /* 白黒・グレースケール（ピンクに合わせて少し暖色寄りに） */
    --white: #ffffff;
    --black: #000000;
    --gray-100: #faf6f7;
    --gray-200: #f4e8eb;
    --gray-300: #e8dadd;
    --gray-400: #d5c4c8;
    --gray-500: #bcaaa6;
    --gray-600: #8d6e63;
    --gray-700: #5d4037;
    --gray-800: #4e342e;
    --gray-900: #3e2723;
    
    /* フォント・その他の設定 */
    --font-family-sans-serif: 'Inter', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --font-size-base: 1rem;
    --line-height-base: 1.5;
    --border-radius: 0.25rem;
    --box-shadow: 0 0.5rem 1rem rgba(100, 50, 60, 0.1);
    --transition-base: all 0.2s ease-in-out;
    --text-muted: #8d6e63;
}

/* Base Styles */
body {
    font-family: 'Inter', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    color: var(--text);
    line-height: 1.6;
}

/* Animations */
.fade-in-up {
    opacity: 0;
    transform: translateY(20px);
    filter: blur(10px);
    transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), filter 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.fade-in-up.is-visible {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

.delay-100 {
    transition-delay: 0.1s;
}

.delay-200 {
    transition-delay: 0.2s;
}

.delay-300 {
    transition-delay: 0.3s;
}

.delay-400 {
    transition-delay: 0.4s;
}

/* Scroll Animation (全ページ共通) */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.animate-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}