/* Custom styles and Tailwind theme overrides */
:root {
    --primary-blue: #2563eb; /* Cobalt Blue */
    --secondary-green: #10b981; /* Emerald Green */
    --accent-orange: #f59e0b; /* Amber */
    --text-dark: #1f2937; /* Gray 900 */
    --text-light: #4b5563; /* Gray 600 */
    --bg-light: #f9fafb; /* Gray 50 */
    --bg-white: #ffffff;
}

body {
    font-family: 'Inter', sans-serif;
    color: var(--text-dark);
    background-color: var(--bg-light);
}

.btn-primary {
    @apply bg-primary-blue text-white font-bold py-3 px-6 rounded-lg shadow-lg hover:bg-blue-700 transition duration-300 ease-in-out transform hover:scale-105;
}

.btn-secondary {
    @apply bg-secondary-green text-white font-bold py-3 px-6 rounded-lg shadow-lg hover:bg-green-700 transition duration-300 ease-in-out transform hover:scale-105;
}

.btn-outline {
    @apply border-2 border-white text-white font-bold py-3 px-6 rounded-lg hover:bg-white hover:text-primary-blue transition duration-300 ease-in-out transform hover:scale-105;
}

.section-title {
    @apply text-4xl md:text-5xl font-extrabold text-center mb-12 text-primary-blue leading-tight;
}

.card {
    @apply bg-white rounded-xl shadow-lg p-8 transform transition duration-300 hover:scale-105 hover:shadow-2xl;
}

/* Responsive adjustments for images and videos */
/* main-visual-container はセクション全体を覆うように変更 */
.main-visual-container {
    position: absolute; /* 親要素に対して絶対配置 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0; /* 最背面 */
}

.main-visual-container img,
.main-visual-container video {
    width: 100%;
    height: 100%;
    object-fit: cover; /* コンテナに合わせて画像をトリミング */
}

/* オーバーレイのスタイル */
.main-visual-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3); /* 半透明の白 */
    backdrop-filter: blur(3px); /* ブラー効果 */
    -webkit-backdrop-filter: blur(3px); /* Safari対応 */
    z-index: 1; /* 画像より手前 */
}

/* Smooth scrolling for anchor links */
html {
    scroll-behavior: smooth;
}