/* Prevent horizontal scrollbar & smooth scroll override */
html, body {
    overflow-x: hidden;
    max-width: 100%;
    scroll-behavior: auto !important;
}

/* ====================================================
   サイト全体の文字サイズルール（トップページ・下層ページ共通）
   ====================================================
   ■ 最小文字サイズルール:
     - PC (md以上): 12px
     - SP (767px以下): 10px
   ■ 本文テキスト: 16px (1rem)
   ■ セクション見出し h2: 24px〜30px
   ■ サブ見出し h3: 20px〜24px
   ==================================================== */

/*
 * 最小文字サイズの強制ルール
 * PC (md以上): 12px / SP (767px以下): 10px
 * 以下の font-size: max() でテキスト要素のみ底上げ
 */
main span, main p, main a, main h1, main h2, main h3, main h4, main h5, main h6,
main label, main td, main th, main li, main dd, main dt, main figcaption, main time {
    font-size: max(var(--tw-font-size, inherit), 0.75rem); /* 最低12px */
}

@media (max-width: 767px) {
    main span, main p, main a, main h1, main h2, main h3, main h4, main h5, main h6,
    main label, main td, main th, main li, main dd, main dt, main figcaption, main time {
        font-size: max(var(--tw-font-size, inherit), 0.625rem); /* SP最低10px */
    }
}

/* 下層ページ本文のデフォルトサイズを確保 */
main {
    font-size: 1rem; /* 16px */
    line-height: 1.8;
}

main p,
main li,
main td,
main dd {
    font-size: 1rem; /* 16px = text-base */
    line-height: 1.8;
}

/* 下層ページの小さすぎるテキストへの底上げ（text-sm → 15px） */
main .text-sm {
    font-size: 0.9375rem; /* 15px */
}

/* FAQ回答テキストの読みやすさ確保 */
.faq-content .text-sm,
.faq-content .text-base {
    font-size: 1rem;
    line-height: 1.9;
}

/* ====================================================
   中央寄せ見出しの下部装飾
   ==================================================== */
.heading-center-decorated {
    position: relative;
    display: inline-block;
    padding-bottom: 12px;
}
.heading-center-decorated::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 3px;
    background: linear-gradient(90deg, #54bff0, #70e3d5);
    border-radius: 2px;
}

/* ====================================================
   写真ラベル: 正円バッジ
   写真枠の角から外にはみ出す配置用
   ==================================================== */
.photo-label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    background: #f9d654;
    color: #5a3e00;
    font-size: 12px;
    font-weight: 800;
    text-align: center;
    line-height: 1.3;
    white-space: nowrap;
    border-radius: 50%;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
    transform: rotate(-6deg);
    pointer-events: none;
}

/* サイズバリエーション */
.photo-label--sm {
    width: 56px;
    height: 56px;
    font-size: 10px;
}
.photo-label--lg {
    width: 88px;
    height: 88px;
    font-size: 13px;
}

/* 下層ページ: セクション間の余白を適切に */
main > section {
    position: relative;
}



/* ====================================================
   ページヒーロー: 気泡バブルアニメーション
   ==================================================== */
.bubble {
    position: absolute;
    border-radius: 50%;
    animation: bubble-rise 4s ease-in infinite;
}
@keyframes bubble-rise {
    0% {
        transform: translateY(0) scale(1);
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    80% {
        opacity: 0.6;
    }
    100% {
        transform: translateY(-160px) scale(0.5);
        opacity: 0;
    }
}

/* Noise texture background to make it feel less digital */
body {
    position: relative;
}
body::before {
    content: '';
    position: fixed;
    top: 0; left: 0; width: 100vw; height: 100vh;
    pointer-events: none;
    z-index: 9999;
    opacity: 0.04;
    background-image: url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noiseFilter"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.65" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noiseFilter)"/%3E%3C/svg%3E');
}

/* Glassmorphism */
.glass {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.03);
}

/* Header: ブルー×ミントの淡いグラデーション背景 */
#header.glass {
    background: linear-gradient(90deg, rgba(232, 247, 253, 0.88), rgba(234, 250, 248, 0.88));
    border-bottom: 1px solid rgba(84, 210, 200, 0.15);
    box-shadow: 0 4px 20px rgba(84, 200, 210, 0.06);
}

/* セクション共通ボーダー（bodyとの境界を明確化） */
section.z-20 {
    border: 2px solid rgba(255, 255, 255, 0.7);
}

/* フッター: 全テキスト太字化 + 青×ミント中間色シャドウ */
footer {
    font-weight: 700;
}
footer a,
footer p,
footer span,
footer div {
    text-shadow: 0 1px 6px rgba(50, 160, 180, 0.4), 0 1px 2px rgba(50, 160, 180, 0.25);
}
footer a.bg-white,
footer a.bg-white span,
footer a.bg-white i {
    text-shadow: none;
    box-shadow: none;
}
footer a.rounded-full,
footer a.rounded-xl {
    box-shadow: 0 2px 10px rgba(50, 160, 180, 0.35);
}
footer a.bg-white.rounded-full {
    box-shadow: none;
}

/* NEWS: 星装飾のSP対応（スマホ時は半分のサイズに縮小、散らばりは維持） */
@media (max-width: 767px) {
    .news-stars-container {
        transform: scale(0.5);
        transform-origin: top left;
        width: 200%;
        height: 200%;
    }
}

/* Organic Shapes Animation */
.organic-shape {
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
    animation: morph 8s ease-in-out infinite both alternate;
}

@keyframes morph {
    0% { border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%; }
    100% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; }
}

/* Button Micro-interactions */
.btn-hover {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.btn-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
}
/* backdrop-filter フォールバック（非対応ブラウザ向け） */
@supports not (backdrop-filter: blur(1px)) {
    .glass {
        background: rgba(255, 255, 255, 0.97) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
    /* ヘッダー・モバイルCTAバーのbackdrop-blurの代替 */
    [class*="backdrop-blur"] {
        --tw-backdrop-blur: none !important;
        background-color: rgba(255, 255, 255, 0.97) !important;
    }
}

/* Instagram 公式グラデーション */
.ig-gradient {
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* ホバー時：グラデーション解除 → 白アイコン */
.group\/ig:hover .ig-gradient {
    background: none;
    -webkit-background-clip: unset;
    background-clip: unset;
    -webkit-text-fill-color: white;
    color: white;
}
/* お知らせ「一覧を見る」矢印ホバー */
.group:hover .news-arrow {
    background: #ff8544 !important;
    color: #fff !important;
}
/* フロアマップ丸型写真サイズ */
.floormap-photo {
    width: 25%;
    top: -24%;
}
@media (min-width: 768px) {
    .floormap-photo {
        width: 30%;
        top: -32%;
    }
}

