/* =============================================
   ShareOffice URL - main.css
   ============================================= */

/* ----- CSS カスタムプロパティ（変数） ----- */
:root {
    /* ===== ブランドカラー: ロゴ画像より抽出 ===== */
    --color-primary:      #2b2d5a;   /* ネイビー: ロゴ文字色 */
    --color-text:         #2b2d5a;   /* 本文: ネイビー系 */
    --color-text-light:   #44455f;   /* サブテキスト */
    --color-bg:           #ffffff;
    --color-bg-warm:      #f7f4f0;   /* ウォームクリーム: 壁の質感 */
    --color-bg-light:     #f7f4f0;
    --color-border:       #e8e4df;

    /* ===== 花びらパレット（アクセント・グラデーション用） ===== */
    --petal-pink:    #f2bece;   /* ソフトピンク */
    --petal-lavender:#d4b8e0;   /* ラベンダー */
    --petal-blue:    #b8d4ec;   /* ライトブルー */
    --petal-yellow:  #f0dc88;   /* ペールイエロー */
    --petal-mint:    #b8e0c8;   /* ミントグリーン */
    --petal-peach:   #f4c4a8;   /* ピーチ */

    /* ===== グラデーション: 花びら5色 ===== */
    --gradient-petal: linear-gradient(
        135deg,
        #f2bece 0%,
        #d4b8e0 25%,
        #b8d4ec 50%,
        #b8e0c8 75%,
        #f4c4a8 100%
    );
    --gradient-petal-soft: linear-gradient(
        120deg,
        rgba(242,190,206,.35) 0%,
        rgba(212,184,224,.35) 30%,
        rgba(184,212,236,.35) 60%,
        rgba(184,224,200,.35) 100%
    );

    --font-base:  'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
    --font-size-base: 16px;
    --line-height-base: 1.8;

    --container-width: 1100px;
    --container-pad:   clamp(16px, 5vw, 40px);

    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;

    --transition: 0.2s ease;
}

/* ----- リセット・ベース ----- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: var(--font-size-base); scroll-behavior: smooth; overflow-x: hidden; }
body {
    margin: 0;
    font-family: var(--font-base);
    color: var(--color-text);
    background: var(--color-bg);
    line-height: var(--line-height-base);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--color-primary); text-decoration: none; transition: opacity var(--transition); }
a:hover { opacity: 0.75; }
ul, ol { list-style: none; }

/* ----- コンテナ ----- */
.container {
    max-width: var(--container-width);
    margin-inline: auto;
    padding-inline: var(--container-pad);
}

/* ----- セクション共通 ----- */
.section-title {
    font-size: clamp(1.5rem, 4vw, 3rem);
    font-weight: 700;
    text-align: center;
    color: var(--color-primary);
    margin-bottom: 2rem;
    position: relative;
    padding-bottom: 1rem;
}
/* 見出し下線: 花びらグラデーション */
.section-title::after {
    content: '';
    display: block;
    width: 56px;
    height: 3px;
    border-radius: 99px;
    background: var(--gradient-petal);
    margin: 0.75rem auto 0;
}
.section-lead {
    text-align: center;
    color: var(--color-text-light);
    margin-bottom: 2rem;
}
section { padding-block: clamp(48px, 8vw, 80px); }
/* fixed ヘッダー分のオフセット（フロントページ以外） */
.site-main:not(.front-page) { padding-top: 112px; }
.section--bg-light { background: var(--color-bg-light); }

/* ----- ボタン ----- */
.btn {
    display: inline-block;
    padding: 0.75em 2em;
    border-radius: var(--radius-md);
    font-weight: 700;
    font-size: 1rem;
    cursor: pointer;
    transition: background var(--transition), color var(--transition), opacity var(--transition);
    border: 2px solid transparent;
}
.btn--primary {
    background: var(--color-primary);
    color: #fff;
    border-color: var(--color-primary);
}
.btn--primary:hover { opacity: 0.85; }
.btn--outline {
    background: transparent;
    color: var(--color-primary);
    border-color: var(--color-primary);
}
.btn--outline:hover { background: var(--color-primary); color: #fff; }
.btn--lg { font-size: 1.125rem; padding: 1em 2.5em; }
.btn--line {
    background: #06C755;
    color: #fff;
    border-color: #06C755;
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
}
.btn--line:hover { opacity: 0.85; }


/* ==============================================
   ヘッダー
   ============================================== */
.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    height: 140px;
    background: #fff;
    transform: translateY(-100%);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.site-header.is-scrolled {
    transform: translateY(0);
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
}
.header-inner {
    height: 100%;
    padding-left: clamp(20px, 3vw, 48px);
    padding-right: calc(10vw + clamp(20px, 3vw, 48px));
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

/* ロゴ */
.site-branding { flex-shrink: 0; margin-left: clamp(3rem, 12vw, 11rem); }
.site-logo-link { display: block; line-height: 0; }
.site-logo {
    height: 120px;
    width: auto;
    display: block;
    object-fit: contain;
}
.site-logo-link:hover { opacity: 0.7; }
/* カスタマイザーロゴ（WordPress標準出力） */
.site-branding .custom-logo-link { display: block; line-height: 0; }
.site-branding .custom-logo-link:hover { opacity: 0.7; }
.site-branding .custom-logo {
    height: 120px;
    width: auto;
    display: block;
    object-fit: contain;
}

/* グローバルナビ */
.global-nav { margin-left: auto; }
.global-nav ul {
    display: flex;
    align-items: center;
    gap: 0;
    list-style: none;
}
.global-nav ul li a {
    display: block;
    position: relative;
    padding: 0.3em 0.9em 0.45em;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--color-primary);
    text-align: center;
    white-space: nowrap;
    transition: color var(--transition);
}
.global-nav ul li a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0.9em;
    right: 0.9em;
    height: 2px;
    background: #e8c000;
    border-radius: 2px;
    transform: scaleX(0);
    transition: transform 0.22s ease;
}
.global-nav ul li a:hover { color: var(--color-primary); opacity: 1; }
.global-nav ul li a:hover::after { transform: scaleX(1); }
/* アクティブ */
.global-nav ul li.current-menu-item > a::after,
.global-nav ul li.current-menu-ancestor > a::after {
    transform: scaleX(1);
}

/* ヘッダー右: アクション */
.header-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}
.header-cta-btn {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--color-primary);
    background: #e8c000;
    padding: 0.5em 1.2em;
    border-radius: 999px;
    white-space: nowrap;
    transition: background var(--transition), opacity var(--transition);
}
.header-cta-btn:hover {
    background: #d4ae00;
    color: var(--color-primary);
    opacity: 1;
}

/* ハンバーガー（SP） */
.nav-toggle {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 22px;
    height: 14px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}
.nav-toggle__bar {
    display: block;
    width: 100%;
    height: 1px;
    background: #333;
    transition: transform var(--transition), opacity var(--transition);
}

/* ==============================================
   FV（ファーストビュー）
   ============================================== */
.fv {
    width: 100%;
    height: 100vh;
    height: 100svh;
    min-height: 400px;
    position: relative;
    overflow: hidden;
}

/* 写真エリア */
.fv__img-wrap {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

/* スライダー */
.fv-slider {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.fv-slider--sp { display: none; }
@media (max-width: 768px) {
    .fv-slider--pc { display: none; }
    .fv-slider--sp { display: block; width: 100%; height: 100%; }
}
.fv-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1.2s ease;
}
.fv-slide.is-active {
    opacity: 1;
}
.fv__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 40%;
    display: block;
}

/* スライドドット */
.fv-dots {
    position: absolute;
    bottom: 1.5rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 0.5rem;
    z-index: 5;
}
.fv-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.45);
    transition: background 0.3s, transform 0.3s;
    cursor: pointer;
}
.fv-dot.is-active {
    background: #fff;
    transform: scale(1.3);
}

/* ==============================================
   CONCEPTセクション
   ============================================== */
.section-concept {
    background: #fffdf0;
    padding-top: clamp(60px, 8vw, 100px);
    padding-bottom: clamp(80px, 12vw, 140px);
    position: relative;
    overflow: hidden;
}
/* 花: <img> タグで配置（iOS Safari 疑似要素 background-image 非表示バグ回避） */
.concept-flower {
    position: absolute;
    pointer-events: none;
    z-index: 0;
}
.concept-flower--left {
    left: 20px;
    top: 20px;
    width: 300px;
    height: 300px;
    opacity: 0.18;
    transform: rotate(15deg);
}
.concept-flower--right {
    right: 20px;
    bottom: 20px;
    width: 380px;
    height: 380px;
    opacity: 0.25;
    transform: rotate(-20deg);
}
.concept-inner {
    max-width: 960px;
    margin-inline: auto;
    padding-inline: var(--container-pad);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    position: relative;
    z-index: 1;
}
.concept-title {
    white-space: nowrap;
}
.concept-label {
    font-family: 'Allura', cursive;
    font-size: clamp(5rem, 14vw, 12rem);
    font-weight: 400;
    color: var(--color-primary);
    opacity: 0.18;
    line-height: 1;
    letter-spacing: 0.02em;
}
.concept-title {
    font-size: clamp(1.6rem, 3.5vw, 2.6rem);
    font-weight: 700;
    color: var(--color-primary);
    line-height: 1.55;
    letter-spacing: 0.04em;
}
.concept-body {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}
.concept-body p {
    font-size: clamp(0.9rem, 1.6vw, 1rem);
    color: var(--color-text-light);
    line-height: 2;
    letter-spacing: 0.06em;
}
.concept-body p:first-child {
    font-size: clamp(1rem, 1.8vw, 1.1rem);
    color: var(--color-primary);
    font-weight: 500;
}
/* 花びらグラデーションの区切り線 */
.concept-line {
    width: 80px;
    height: 2px;
    background: var(--gradient-petal);
    border-radius: 99px;
    margin-block: 0.5rem;
}

/* ==============================================
   SP対応
   ============================================== */
@media (max-width: 768px) {
    /* スマホ: 常時透明表示、ハンバーガーのみ右に固定 */
    .site-header {
        height: 72px;
        transform: translateY(0);
        background: transparent;
        box-shadow: none;
    }
    .site-header.is-scrolled {
        background: #fff;
        box-shadow: 0 2px 12px rgba(0,0,0,.08);
    }
    .site-header:not(.is-scrolled) .site-branding,
    .site-header:not(.is-scrolled) .header-cta-btn {
        opacity: 0;
        pointer-events: none;
    }
    .site-header:not(.is-scrolled) .nav-toggle__bar {
        background: #fff;
    }
    .fv { height: 100svh; }
    .concept-title { white-space: normal; }
    .site-main:not(.front-page) { padding-top: 72px; }
    .nav-toggle { display: flex; }
    .global-nav {
        display: none;
        position: absolute;
        top: 72px; left: 0; right: 0;
        background: #fff;
        border-top: 1px solid var(--color-border);
        padding: 1rem 0;
    }
    .global-nav.is-open { display: block; }
    .global-nav ul { flex-direction: column; gap: 0; }
    .global-nav ul li a {
        padding: 0.75em 1.5rem;
        font-size: 0.8rem;
        border: none !important;
    }
    .header-cta-btn { display: none; }
}

/* ==============================================
   強みセクション
   ============================================== */
.section-features {
    background: #fff;
    overflow: hidden;
    padding-bottom: clamp(4rem, 8vw, 7rem);
}
.features-header {
    position: relative;
    text-align: center;
    padding-top: clamp(3rem, 8vw, 5rem);
    margin-bottom: 1rem;
}
.features-header__ghost {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    font-size: clamp(4rem, 11vw, 8rem);
    font-weight: 900;
    font-family: 'Arial Black', 'Helvetica Neue', sans-serif;
    letter-spacing: 0.1em;
    line-height: 1;
    color: rgba(0,0,0,0.05);
    white-space: nowrap;
    pointer-events: none;
    text-transform: uppercase;
    z-index: 0;
}
.features-header .section-title {
    position: relative;
    z-index: 1;
}
.section-features > .container {
    padding-bottom: 0;
}
.features-list {
    display: flex;
    flex-direction: column;
    gap: calc(50px + 3rem);
    margin-top: clamp(2rem, 4vw, 3rem);
}
.features-item {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    position: relative;
}
/* 奇数：右端まで全幅ブリード */
.features-item:nth-child(odd)::before {
    content: '';
    position: absolute;
    inset: 0;
    left: -100px;
    right: -100vw;
    border-radius: 28px 0 0 28px;
    z-index: 0;
    pointer-events: none;
}
/* 偶数：左端まで全幅ブリード */
.features-item:nth-child(even)::before {
    content: '';
    position: absolute;
    inset: 0;
    left: -100vw;
    right: -100px;
    border-radius: 0 28px 28px 0;
    z-index: 0;
    pointer-events: none;
}
.features-item:nth-child(1)::before { background: rgba(184,212,236,.5); }  /* ライトブルー */
.features-item:nth-child(2)::before { background: rgba(184,224,200,.5); }  /* ミントグリーン */
.features-item:nth-child(3)::before { background: rgba(212,184,224,.5); }  /* ラベンダー */
.features-item:nth-child(4)::before { background: rgba(240,220,136,.5); }  /* ペールイエロー */

/* ビジュアル：背景なし、アイコンのみ */
.features-item__visual {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    min-height: 420px;
    overflow: visible;
    position: relative;
    z-index: 1;
    background: none;
}
/* アイコン／画像をボックス下からはみ出させる */
.features-item__visual-icon,
.features-item__img {
    transform: translateY(-6px);
    display: block;
}
.features-item__visual-icon {
    font-size: 7rem;
    filter: drop-shadow(0 8px 24px rgba(43,45,90,.2));
}
.features-item__img {
    width: clamp(360px, 90%, 520px);
    height: clamp(360px, 90%, 520px);
    aspect-ratio: 1 / 1;
    object-fit: contain;
    filter: drop-shadow(0 8px 24px rgba(43,45,90,.18));
}

/* テキスト：奇数は右カラム、偶数は左カラム */
.features-item__body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 1;
    padding-top: clamp(5rem, 9vw, 7rem);
    padding-bottom: clamp(2.5rem, 5vw, 4rem);
}
.features-item:nth-child(odd) .features-item__body {
    padding-left: clamp(2rem, 3vw, 3rem);
    padding-right: 0;
}
.features-item:nth-child(even) .features-item__body {
    padding-left: 0;
    padding-right: clamp(2rem, 3vw, 3rem);
}
.features-item__ghost {
    position: absolute;
    top: clamp(0.75rem, 2vw, 1.5rem);
    left: 0;
    right: 0;
    font-size: 3rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-align: left;
    color: rgba(0,0,0,0.07);
    pointer-events: none;
    z-index: 0;
    font-family: 'Arial Black', 'Helvetica Neue', sans-serif;
    text-transform: uppercase;
}
/* 奇数行: body の padding-left に合わせてゴーストを右にオフセット */
.features-item:nth-child(odd) .features-item__ghost {
    left: clamp(2rem, 3vw, 3rem);
}
.features-item__title {
    font-size: clamp(1.05rem, 2.5vw, 2rem);
    font-weight: 700;
    color: var(--color-primary);
    margin-bottom: 0.75rem;
    line-height: 1.3;
}
.features-item__text {
    font-size: 0.95rem;
    color: var(--color-text-light);
    line-height: 1.85;
}

/* ==============================================
   設備・サービス
   ============================================== */
.section-service {
    background: #fffdf0;
    padding-block: clamp(4rem, 8vw, 7rem);
    overflow: hidden;
}
.service-header {
    position: relative;
    text-align: center;
    margin-bottom: clamp(2rem, 5vw, 3.5rem);
    padding-top: clamp(3rem, 8vw, 5rem);
}
.service-header__ghost {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    font-size: clamp(4rem, 11vw, 8rem);
    font-weight: 900;
    font-family: 'Arial Black', 'Helvetica Neue', sans-serif;
    letter-spacing: 0.1em;
    line-height: 1;
    color: rgba(0,0,0,0.05);
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
    text-transform: uppercase;
    z-index: 0;
}
.service-list {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1.5rem;
    list-style: none;
    padding: 0;
    margin: 0;
}
.service-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 2.25rem 1rem;
    background: var(--color-bg-warm);
    border-radius: var(--radius-md);
    text-align: center;
}
.service-item__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    color: var(--color-primary);
}
.service-item__icon svg {
    width: 100%;
    height: 100%;
}
.service-item__label {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--color-text);
    line-height: 1.6;
    margin: 0;
}
.service-note {
    margin-top: 3rem;
    padding: 2rem 2.5rem;
    background: #fff;
    border: 2px solid var(--color-border);
    border-radius: 16px;
    text-align: center;
    position: relative;
}
.service-note__title {
    display: inline-block;
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
    background: var(--color-primary);
    padding: 0.35em 1.5em;
    border-radius: 999px;
    margin: 0 0 1.25rem;
    letter-spacing: 0.05em;
}
.service-note__text {
    font-size: 0.95rem;
    color: var(--color-text);
    margin: 0 0 0.75rem;
    line-height: 1.8;
}
.service-note__remarks {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.service-note__remarks li {
    font-size: 0.825rem;
    color: var(--color-text-light);
    line-height: 1.7;
}

/* ==============================================
   料金・プラン
   ============================================== */
.section-plan {
    background: #252f3c;
    padding-block: clamp(4rem, 8vw, 7rem);
    overflow: hidden;
}
.plan-header {
    position: relative;
    text-align: center;
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
    padding: clamp(3rem, 8vw, 5rem) 0 2rem;
}
.plan-header__ghost {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    font-size: clamp(2.5rem, 7vw, 5.5rem);
    font-weight: 900;
    font-family: 'Arial Black', 'Helvetica Neue', sans-serif;
    letter-spacing: 0.1em;
    line-height: 1;
    color: rgba(255,255,255,0.05);
    white-space: nowrap;
    pointer-events: none;
    text-transform: uppercase;
    z-index: 0;
}
.plan-header .section-title {
    position: relative;
    z-index: 1;
    color: #fff;
}
.plan-header .section-title::after {
    background: rgba(255,255,255,0.3);
}
.plan-group {
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.plan-group__title {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,0.2);
    padding-bottom: 0.6rem;
    margin-bottom: 1.5rem;
}
.plan-group__title-en {
    font-size: 0.78rem;
    font-weight: 400;
    letter-spacing: 0.12em;
    color: rgba(255,255,255,0.4);
}
.plan-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
}
.plan-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: 1.5px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: 0 2px 16px rgba(43,45,90,.06);
    position: relative;
}
.plan-card__photo {
    position: relative;
    min-height: 310px;
    overflow: hidden;
}
.plan-card__photo-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.plan-card__photo-label {
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(37,47,60,0.88);
    color: #fff;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 0.4em 0.9em;
    letter-spacing: 0.04em;
    z-index: 1;
}
.plan-card__info {
    background: #fff;
    padding: 1.4rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}
.plan-card__price {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--color-primary);
    line-height: 1;
}
.plan-card__price small {
    font-size: 0.85rem;
    font-weight: 400;
}
.plan-card__desc {
    font-size: 0.85rem;
    color: var(--color-text-light);
    line-height: 1.7;
}
.plan-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.plan-card__meta-item {
    display: flex;
    align-items: stretch;
    border: 1px solid var(--color-border);
    border-radius: 4px;
    overflow: hidden;
    font-size: 0.8rem;
}
.plan-card__meta-item dt {
    background: var(--color-bg-warm);
    padding: 0.3em 0.6em;
    color: var(--color-text-light);
    font-weight: 500;
    border-right: 1px solid var(--color-border);
}
.plan-card__meta-item dd {
    padding: 0.3em 0.7em;
    color: var(--color-text);
    font-weight: 600;
}
.plan-card__equipment {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    flex: 1;
}
.plan-card__equipment-label {
    display: inline-block;
    border: 1px solid var(--color-border);
    border-radius: 4px;
    padding: 0.15em 0.6em;
    font-size: 0.78rem;
    color: var(--color-text-light);
    font-weight: 500;
    align-self: flex-start;
}
.plan-card__equipment ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}
.plan-card__equipment li {
    font-size: 0.78rem;
    color: var(--color-text);
    line-height: 1.5;
    padding-left: 0.9em;
    position: relative;
}
.plan-card__equipment li::before {
    content: '・';
    position: absolute;
    left: 0;
    color: var(--color-text-light);
}
.plan-card__btn {
    margin-top: auto;
    text-align: center;
    display: block;
    width: 100%;
    background: #d4a820;
    border-color: #d4a820;
    color: #fff;
    border-radius: 999px;
}
.plan-card__btn:hover {
    background: #b8901a;
    border-color: #b8901a;
    opacity: 1;
}

/* ==============================================
   ご利用方法（予約方法）
   ============================================== */
.section-flow {
    background: var(--color-bg-warm);
    padding-block: clamp(4rem, 8vw, 7rem);
    overflow: hidden;
}
.flow-header {
    position: relative;
    text-align: center;
    margin-bottom: clamp(2rem, 4vw, 3rem);
    padding: clamp(3rem, 8vw, 5rem) 0 1.5rem;
}
.flow-header__ghost {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    font-size: clamp(4rem, 11vw, 8rem);
    font-weight: 900;
    letter-spacing: 0.1em;
    line-height: 1;
    color: rgba(0,0,0,0.05);
    white-space: nowrap;
    pointer-events: none;
    font-family: 'Arial Black', 'Helvetica Neue', sans-serif;
    text-transform: uppercase;
    z-index: 0;
}
.flow-header .section-title {
    position: relative;
    z-index: 1;
}
.reserve-cards {
    display: flex;
    flex-direction: row;
    gap: 2rem;
}
.reserve-card {
    flex: 1;
    min-width: 0;
    background: #fff;
    border-radius: var(--radius-lg);
    padding: clamp(2rem, 4vw, 3rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    border: 1.5px solid var(--color-border);
    box-shadow: 0 2px 16px rgba(43,45,90,.06);
    text-align: center;
}
.reserve-card__icon {
    font-size: 2.5rem;
    display: block;
}
.reserve-card__title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--color-primary);
}
.reserve-card__text {
    font-size: 0.9rem;
    color: var(--color-text-light);
    line-height: 1.85;
    flex: 1;
}
.reserve-card__note {
    font-size: 0.82rem;
    color: var(--color-text-light);
    line-height: 1.7;
    text-align: center;
}
.reserve-card__btn {
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 0.5rem;
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
    border-radius: 999px;
    padding: 0.85em 2em;
    font-weight: 700;
}
.reserve-card__btn:hover {
    background: #1a1c3a;
    border-color: #1a1c3a;
    color: #fff;
    opacity: 1;
}

/* 利用規約ノート */
.flow-terms-note {
    margin-top: 3rem;
    padding: 2rem 2.5rem;
    background: #fff;
    border: 2px solid var(--color-border);
    border-radius: 16px;
    text-align: center;
}
.flow-terms-note__title {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--color-text);
    margin: 0 0 0.5rem;
}
.flow-terms-note__text {
    font-size: 0.875rem;
    color: var(--color-text-light);
    margin: 0 0 1.25rem;
    line-height: 1.7;
}
.flow-terms-note__btn {
    display: inline-block;
    font-size: 0.875rem;
    font-weight: 700;
    color: #fff;
    background: var(--color-primary);
    padding: 0.55em 2.5em;
    border-radius: 999px;
    letter-spacing: 0.05em;
    transition: background var(--transition);
}
.flow-terms-note__btn:hover {
    background: #1a1c3a;
    color: #fff;
    opacity: 1;
}

/* キャンセルポリシー */
.cancel-policy {
    margin-top: 3rem;
}
.cancel-policy__header {
    text-align: center;
    margin-bottom: 1.5rem;
}
.cancel-policy__title {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--color-text-light);
    text-transform: uppercase;
    padding-bottom: 0.4em;
    border-bottom: 2px solid var(--color-border);
}
.cancel-policy__cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.cancel-policy__card {
    border-radius: 12px;
    padding: 1.75rem 1rem 1.5rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.cancel-policy__card-timing {
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin: 0 0 1rem;
    padding: 0.35em 0.8em;
    border-radius: 999px;
    display: inline-block;
}
.cancel-policy__card-fee {
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0;
    line-height: 1.3;
}
.cancel-policy__card-fee span {
    font-size: 2.2rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    display: inline-block;
    vertical-align: baseline;
}
/* 無料 */
.cancel-policy__card--free {
    background: #fff;
    border: 2px solid #b8e0c8;
}
.cancel-policy__card--free .cancel-policy__card-timing {
    background: #b8e0c8;
    color: #1a6b38;
}
.cancel-policy__card--free .cancel-policy__card-fee {
    color: #1a6b38;
    font-size: 1.8rem;
    font-weight: 800;
}
/* 50% */
.cancel-policy__card--half {
    background: #fff;
    border: 2px solid #f0dc88;
}
.cancel-policy__card--half .cancel-policy__card-timing {
    background: #f0dc88;
    color: #7a5c00;
}
.cancel-policy__card--half .cancel-policy__card-fee {
    color: #7a5c00;
}
/* 100% */
.cancel-policy__card--full {
    background: #fff;
    border: 2px solid #f2bece;
}
.cancel-policy__card--full .cancel-policy__card-timing {
    background: #f2bece;
    color: #8b2040;
}
.cancel-policy__card--full .cancel-policy__card-fee {
    color: #8b2040;
}
.cancel-policy__notes {
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 1rem 1.25rem;
    background: var(--color-bg-warm);
    border-radius: 8px;
}
.cancel-policy__notes li {
    font-size: 0.8rem;
    color: var(--color-text-light);
    line-height: 1.7;
}
.cancel-policy__notice {
    padding-top: 1rem;
    border-top: 1px solid var(--color-border);
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.cancel-policy__notice p {
    font-size: 0.825rem;
    color: var(--color-text-light);
    line-height: 1.75;
    margin: 0;
}
@media (max-width: 768px) {
    .cancel-policy__cards { grid-template-columns: 1fr; }
}

/* ==============================================
   アクセス
   ============================================== */
.section-access { overflow: hidden; }
.access-header {
    position: relative;
    text-align: center;
    margin-bottom: clamp(2rem, 4vw, 3rem);
    padding: clamp(3rem, 8vw, 5rem) 0 1.5rem;
}
.access-header__ghost {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    font-size: clamp(4rem, 11vw, 8rem);
    font-weight: 900;
    letter-spacing: 0.1em;
    line-height: 1;
    color: rgba(0,0,0,0.05);
    white-space: nowrap;
    pointer-events: none;
    font-family: 'Arial Black', 'Helvetica Neue', sans-serif;
    text-transform: uppercase;
    z-index: 0;
}
.access-header .section-title {
    position: relative;
    z-index: 1;
}
.access-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: stretch;
}
.access-map {
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.access-table {
    display: flex;
    flex-direction: column;
}
.access-table__row {
    display: grid;
    grid-template-columns: 7em 1fr;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid var(--color-border);
}
.access-table__row:first-child {
    border-top: 1px solid var(--color-border);
}
.access-table__row dt {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-text-light);
    padding-top: 0.1em;
}
.access-table__row dd {
    font-size: 0.9rem;
    color: var(--color-text);
    line-height: 1.8;
}
.access-table__row dd a {
    color: var(--color-primary);
    font-weight: 600;
}
.access-table__row dd small {
    font-size: 0.8rem;
    color: var(--color-text-light);
}
.access-table__row dd ul {
    list-style: none;
    padding: 0;
}
.access-table__row dd ul li::before {
    content: '・';
    color: var(--color-text-light);
}

/* ==============================================
   FAQ
   ============================================== */
.section-faq { overflow: hidden; }
.faq-header {
    position: relative;
    text-align: center;
    margin-bottom: clamp(2rem, 4vw, 3rem);
    padding: clamp(3rem, 8vw, 5rem) 0 1.5rem;
}
.faq-header__ghost {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    font-size: clamp(4rem, 11vw, 8rem);
    font-weight: 900;
    letter-spacing: 0.1em;
    line-height: 1;
    color: rgba(0,0,0,0.05);
    white-space: nowrap;
    pointer-events: none;
    font-family: 'Arial Black', 'Helvetica Neue', sans-serif;
    text-transform: uppercase;
    z-index: 0;
}
.faq-header .section-title {
    position: relative;
    z-index: 1;
}
.faq-list { max-width: 760px; margin-inline: auto; }
.faq-list > div { border-bottom: 1px solid var(--color-border); }
.faq-question {
    font-weight: 700;
    font-size: 1rem;
    padding: 1.25rem 1rem 1.25rem 2.5rem;
    position: relative;
    cursor: pointer;
}
.faq-question::before {
    content: 'Q';
    position: absolute;
    left: 0;
    color: var(--color-primary);
    font-weight: 900;
    font-size: 1.1rem;
}
.faq-answer {
    padding: 0 1rem 1.25rem 2.5rem;
    font-size: 0.95rem;
    color: var(--color-text-light);
    position: relative;
}
.faq-answer::before {
    content: 'A';
    position: absolute;
    left: 0;
    color: var(--petal-pink);
    font-weight: 900;
    font-size: 1.1rem;
}

/* ==============================================
   スクロールアニメーション
   ============================================== */
.fade-up {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}
.fade-up.is-visible {
    opacity: 1;
    transform: translateY(0);
}
/* 子要素のstagger（遅延） */
.features-list .fade-up:nth-child(1) { transition-delay: 0.05s; }
.features-list .fade-up:nth-child(2) { transition-delay: 0.08s; }
.features-list .fade-up:nth-child(3) { transition-delay: 0.08s; }
.features-list .fade-up:nth-child(4) { transition-delay: 0.08s; }
.features-list .fade-up:nth-child(5) { transition-delay: 0.08s; }
.flow-steps .fade-up:nth-child(1) { transition-delay: 0.05s; }
.flow-steps .fade-up:nth-child(2) { transition-delay: 0.12s; }
.flow-steps .fade-up:nth-child(3) { transition-delay: 0.19s; }
.flow-steps .fade-up:nth-child(4) { transition-delay: 0.26s; }

/* ==============================================
   CTAセクション
   ============================================== */
.section-cta {
    position: relative;
    background: #4A556B;
    padding-bottom: clamp(3rem, 6vw, 5rem);
}

/* 上部: 背景帯 + タイトル */
.cta-hero {
    position: relative;
    padding: clamp(3rem, 6vw, 5rem) 1rem clamp(5rem, 9vw, 7rem);
    text-align: center;
    overflow: hidden;
}
.cta-hero__title {
    position: relative;
    z-index: 1;
    font-size: clamp(1.3rem, 3vw, 2rem);
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.06em;
}
.cta-hero__line-lead {
    position: relative;
    z-index: 1;
    color: rgba(255,255,255,0.9);
    font-size: 0.95rem;
    margin: 0.75rem 0 1.25rem;
}
.cta-hero .btn--line {
    position: relative;
    z-index: 1;
}

/* 白カード（hero に食い込む） */
.cta-card {
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: 16px;
    padding: clamp(1.5rem, 4vw, 2.5rem) clamp(1.5rem, 5vw, 3.5rem);
    margin-top: -3.5rem;
    box-shadow: 0 8px 40px rgba(0,0,0,0.15);
}
.cta-card__lead {
    text-align: center;
    font-size: 0.9rem;
    color: var(--color-text-light);
    line-height: 1.8;
    margin-bottom: 2rem;
}
.cta-card__inner {
    display: flex;
    align-items: center;
    gap: 2.5rem;
}
.cta-card__tel {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.3rem;
    padding-right: 2.5rem;
    border-right: 1px solid var(--color-border);
}
.cta-card__tel-row {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.cta-card__tel-icon {
    color: var(--color-primary);
    flex-shrink: 0;
}
.cta-card__tel-number {
    font-size: clamp(1.6rem, 3.5vw, 2.2rem);
    font-weight: 700;
    color: var(--color-primary);
    letter-spacing: 0.03em;
    line-height: 1.1;
}
.cta-card__tel-number:hover { opacity: 0.75; }
.cta-card__tel-hours {
    font-size: 0.8rem;
    color: var(--color-text-light);
}
.cta-card__btns {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.cta-card__btn {
    display: block;
    text-align: center;
    padding: 0.85em 1.5em;
    border-radius: 999px;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    transition: opacity var(--transition), background var(--transition);
}
.cta-card__btn--web {
    background: #e8c000;
    color: var(--color-primary);
}
.cta-card__btn--web:hover { background: #d4ae00; opacity: 1; color: var(--color-primary); }
.cta-card__btn--tel {
    background: transparent;
    color: var(--color-primary);
    border: 2px solid var(--color-primary);
}
.cta-card__btn--tel:hover { background: var(--color-primary); color: #fff; opacity: 1; }

@media (max-width: 768px) {
    .cta-card__inner { flex-direction: column; gap: 1.5rem; }
    .cta-card__tel { border-right: none; border-bottom: 1px solid var(--color-border); padding-right: 0; padding-bottom: 1.5rem; width: 100%; align-items: center; }
    .cta-card__btns { width: 100%; }
}

/* ==============================================
   フッター
   ============================================== */
.site-footer {
    background: #384255;
    color: rgba(255,255,255,.75);
    font-size: 0.875rem;
    /* フッター上部に花びらグラデーションライン */
    border-top: 4px solid transparent;
    border-image: var(--gradient-petal) 1;
}
.footer-inner {
    max-width: var(--container-width);
    margin-inline: auto;
    padding-inline: var(--container-pad);
    padding-block: 3rem;
}
.footer-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2rem;
    margin-bottom: 2rem;
}
.footer-brand .custom-logo,
.footer-brand .site-logo { height: 48px !important; width: auto !important; }
.footer-site-name { font-size: 1.1rem; font-weight: 700; color: #fff; margin-bottom: 0.5rem; }
.footer-tagline { font-size: 0.8rem; }
.footer-nav { padding-top: 2.5rem; }
.footer-nav__title { font-size: 0.875rem; font-weight: 700; color: #fff; margin-bottom: 1rem; letter-spacing: 0.05em; }
.footer-nav ul { display: flex; flex-direction: column; gap: 0.5rem; }
.footer-nav ul li a { color: rgba(255,255,255,.7); font-size: 0.875rem; }
.footer-nav ul li a:hover { color: #fff; opacity: 1; }
.footer-contact-info { margin-top: 1.25rem; display: flex; flex-direction: column; gap: 0.75rem; }
.footer-contact-item { display: flex; align-items: flex-start; gap: 0.75rem; }
.footer-contact-label {
    display: inline-block;
    background: rgba(0,0,0,.4);
    color: #fff;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    padding: 0.22rem 0.55rem;
    border-radius: 3px;
    min-width: 4.5rem;
    text-align: center;
    flex-shrink: 0;
    margin-top: 0.15rem;
}
.footer-contact-value { color: rgba(255,255,255,.85); font-size: 0.875rem; line-height: 1.6; }
.footer-contact-value a { color: rgba(255,255,255,.85); }
.footer-contact-value a:hover { color: #fff; }
.footer-map { display: flex; align-items: stretch; }
.footer-map iframe { width: 100%; height: 220px; border: 0; border-radius: 8px; display: block; }
.footer-bottom {
    border-top: 1px solid rgba(255,255,255,.1);
    padding-top: 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}
.footer-copyright { font-size: 0.8rem; }
.footer-links { display: flex; gap: 1.5rem; flex-wrap: wrap; }
.footer-links li a { color: rgba(255,255,255,.6); font-size: 0.8rem; }
.footer-links li a:hover { color: #fff; opacity: 1; }

/* ==============================================
   レスポンシブ
   ============================================== */
@media (max-width: 768px) {
    .header-inner {
        position: relative;
        height: 64px;
        padding-inline: 16px;
        flex-wrap: nowrap;
        justify-content: flex-end;
    }
    .site-branding {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        margin-left: 0;
    }
    .site-logo,
    .site-branding .custom-logo { height: 40px; }
    .header-cta-btn { display: none; }
    .nav-toggle {
        display: flex;
        position: relative;
        right: auto;
        top: auto;
        transform: none;
    }
    .nav-toggle__bar { height: 2.5px; border-radius: 2px; }
    .global-nav {
        display: none;
        width: 100%;
        order: 3;
        margin-left: 0;
    }
    .global-nav.is-open { display: block; }
    .global-nav ul { flex-direction: column; gap: 0; }
    .global-nav ul li a { padding: 0.75em 0; border-bottom: 1px solid var(--color-border); border-radius: 0; }
    .header-cta-btn { font-size: 0.8rem; padding: 0.5em 1em; }

    /* 花びら: スマホ調整 */
    .concept-flower--left {
        width: 140px;
        height: 140px;
        left: 0;
        top: 0;
    }
    .concept-flower--right {
        width: 180px;
        height: 180px;
        right: 0;
        bottom: 0;
    }

    .access-grid { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-bottom { flex-direction: column; align-items: flex-start; }
    .spec-layout { grid-template-columns: 1fr; }
    .room-cards { grid-template-columns: 1fr; }
    .usecase-grid { grid-template-columns: 1fr; }
    .comparison-grid { grid-template-columns: 1fr; }

    .features-list { gap: 50px; }
    .plan-cards { grid-template-columns: 1fr; }
    .reserve-cards { flex-direction: column; }
    .plan-card { grid-template-columns: 1fr; }
    .plan-card__photo { min-height: 200px; }
    .plan-group__title { font-size: 1rem; }
    .features-item {
        display: flex;
        flex-direction: column;
        min-height: unset;
    }
    /* モバイル：ビジュアルが常に上、背景はテキスト部分を覆う */
    .features-item:nth-child(odd)::before,
    .features-item:nth-child(even)::before {
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        height: 60%;
        border-radius: 0 0 28px 28px;
    }
    .features-item__visual {
        width: 100%;
        min-height: 200px;
        order: 0;
    }
    /* 偶数行もモバイルでは画像を上に */
    .features-item:nth-child(even) .features-item__visual { order: 0; }
    .features-item:nth-child(even) .features-item__body  { order: 1; }
    .features-item__visual-icon {
        font-size: 4.5rem;
        transform: translateY(36px);
    }
    .features-item__body {
        padding: 2rem var(--container-pad) 2rem !important;
    }
    .features-item__ghost {
        font-size: 1.6rem;
        top: -0.5rem;
        left: var(--container-pad);
    }
    .features-item:nth-child(odd) .features-item__ghost {
        left: var(--container-pad);
    }
    .features-item:nth-child(even) .features-item__ghost {
        left: var(--container-pad);
    }
    .features-item__title { font-size: 1.3rem; }

    .service-list { grid-template-columns: 1fr; gap: 0.5rem; }
    .service-item { flex-direction: row; align-items: center; text-align: left; gap: 1rem; padding: 0.75rem 1rem; }
    .service-item__icon { width: 40px; height: 40px; flex-shrink: 0; }
    .service-item__label { white-space: nowrap; }
    .service-item__label br { display: none; }
}

/* ==============================================
   子ページ共通: サービスヒーロー
   ============================================== */
.service-hero {
    background: var(--color-bg-warm);
    position: relative;
    overflow: hidden;
    padding-block: clamp(64px, 12vw, 120px);
    text-align: center;
}
.service-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--gradient-petal-soft);
    pointer-events: none;
}
.service-hero::after {
    content: '';
    position: absolute;
    top: -100px; right: -100px;
    width: 360px; height: 360px;
    border-radius: 50%;
    background: var(--gradient-petal);
    opacity: 0.15;
    pointer-events: none;
}
.service-hero__inner { position: relative; z-index: 1; }
.service-hero__label {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    color: var(--color-text-light);
    margin-bottom: 0.75rem;
    display: block;
}
.service-hero__title {
    font-size: clamp(1.5rem, 4vw, 2.5rem);
    font-weight: 700;
    color: var(--color-primary);
    line-height: 1.3;
    margin-bottom: 1rem;
}
.service-hero__lead {
    font-size: 1rem;
    color: var(--color-text-light);
    margin-bottom: 2rem;
    line-height: 1.9;
}

/* ヒーロー左下の装飾円（部屋ごとに色を変える） */
.service-hero--meeting::after { background: linear-gradient(135deg, var(--petal-pink), var(--petal-lavender)); }
.service-hero--seminar::after { background: linear-gradient(135deg, var(--petal-blue), var(--petal-mint)); }
.service-hero--dropin::after  { background: linear-gradient(135deg, var(--petal-yellow), var(--petal-peach)); }

/* ==============================================
   利用規約ページ
   ============================================== */
.section-terms {
    padding-block: clamp(3rem, 8vw, 6rem);
}
.terms-body {
    max-width: 860px;
    margin-inline: auto;
    line-height: 1.9;
    color: var(--color-text);
}
.terms-meta {
    font-size: 0.85rem;
    color: var(--color-text-light);
    margin-bottom: 2.5rem;
    padding: 0.75rem 1.25rem;
    background: var(--color-bg-warm);
    border-radius: var(--radius-sm);
    display: inline-block;
}
.terms-heading-main {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--color-primary);
    border-left: 4px solid var(--color-primary);
    padding-left: 0.75em;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
}
.terms-heading-sub {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-text);
    margin-top: 1.75rem;
    margin-bottom: 0.6rem;
}
.terms-heading-item {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--color-text);
    margin-top: 1.25rem;
    margin-bottom: 0.5rem;
}
.terms-body p {
    font-size: 0.9rem;
    margin-bottom: 0.85rem;
}
.terms-body ul,
.terms-body ol {
    font-size: 0.9rem;
    padding-left: 1.5em;
    margin-bottom: 1rem;
}
.terms-body li {
    margin-bottom: 0.5rem;
}
.terms-sub-list {
    margin-top: 0.5rem;
    padding-left: 1.5em;
}
.terms-divider {
    border: none;
    border-top: 1px solid var(--color-border);
    margin-block: 2.5rem;
}
.terms-company {
    text-align: right;
    font-weight: 700;
    margin-top: 2rem;
    font-size: 0.95rem;
    color: var(--color-primary);
}

/* ==============================================
   子ページ: 部屋カード（会議室）
   ============================================== */
.room-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}
.room-card {
    background: #fff;
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: 0 2px 16px rgba(43,45,90,.07);
    display: flex;
    flex-direction: column;
}
.room-card__header {
    padding: 1.5rem;
    text-align: center;
}
.room-card--pink   .room-card__header { background: rgba(242,190,206,.2); }
.room-card--blue   .room-card__header { background: rgba(184,212,236,.2); }
.room-card--orange .room-card__header { background: rgba(244,196,168,.2); }
.room-card__name  { font-size: 1.1rem; font-weight: 700; color: var(--color-primary); margin-bottom: 0.5rem; }
.room-card__price { font-size: 1.75rem; font-weight: 900; color: var(--color-primary); }
.room-card__price span { font-size: 0.875rem; font-weight: 400; }
.room-card__specs {
    padding: 1.25rem 1.5rem;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.4rem 1rem;
    font-size: 0.875rem;
    flex: 1;
}
.room-card__specs dt { font-weight: 700; color: var(--color-text-light); white-space: nowrap; }
.room-card__specs dd { color: var(--color-text); }
.room-card__best {
    padding: 0 1.5rem 1rem;
    font-size: 0.875rem;
    color: var(--color-text-light);
}
.room-card .btn { margin: 0 1.5rem 1.5rem; }

/* ==============================================
   子ページ: 設備アメニティリスト
   ============================================== */
.amenity-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.75rem;
}
.amenity-list li {
    background: #fff;
    border-radius: var(--radius-md);
    padding: 0.875rem 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: var(--color-primary);
    box-shadow: 0 1px 6px rgba(43,45,90,.05);
    font-weight: 500;
}
.amenity-icon { font-size: 1.25rem; flex-shrink: 0; }

/* ==============================================
   子ページ: 利用シーングリッド
   ============================================== */
.usecase-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
}
.usecase-item {
    background: #fff;
    border-radius: var(--radius-md);
    padding: 1.25rem;
    box-shadow: 0 1px 8px rgba(43,45,90,.06);
    border-left: 3px solid var(--petal-lavender);
}
.usecase-item:nth-child(2n) { border-left-color: var(--petal-blue); }
.usecase-item:nth-child(3n) { border-left-color: var(--petal-pink); }
.usecase-item h3 { font-size: 0.95rem; font-weight: 700; color: var(--color-primary); margin-bottom: 0.5rem; }
.usecase-item p  { font-size: 0.875rem; color: var(--color-text-light); line-height: 1.7; }

/* ==============================================
   子ページ: スペック表
   ============================================== */
.spec-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: start;
}
.spec-table { width: 100%; border-collapse: collapse; }
.spec-table th, .spec-table td {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--color-border);
    font-size: 0.9rem;
    text-align: left;
}
.spec-table th {
    width: 30%;
    font-weight: 700;
    color: var(--color-text-light);
    white-space: nowrap;
}
/* ==============================================
   子ページ: キャンセル表
   ============================================== */
.section-cancel .container { max-width: 640px; }
.cancel-table { width: 100%; border-collapse: collapse; }
.cancel-table th, .cancel-table td {
    padding: 0.875rem 1.25rem;
    border: 1px solid var(--color-border);
    font-size: 0.9rem;
    text-align: left;
}
.cancel-table th { background: var(--color-bg-warm); font-weight: 700; }
.cancel-free { color: #2a8a4a; font-weight: 700; }
.cancel-note { font-size: 0.8rem; color: var(--color-text-light); margin-top: 0.75rem; }

/* ==============================================
   子ページ: カフェ比較（ドロップイン）
   ============================================== */
.comparison-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    max-width: 800px;
    margin-inline: auto;
}
.comparison-col {
    border-radius: var(--radius-lg);
    padding: 1.5rem;
}
.comparison-col--cafe { background: var(--color-bg-warm); border: 1.5px solid var(--color-border); }
.comparison-col--url  { background: #fff; border: 2px solid var(--petal-lavender); box-shadow: 0 2px 16px rgba(43,45,90,.07); }
.comparison-col h3 { font-size: 1rem; font-weight: 700; color: var(--color-primary); margin-bottom: 1rem; text-align: center; }
.comparison-col ul { display: flex; flex-direction: column; gap: 0.6rem; }
.comparison-col li { font-size: 0.875rem; padding-left: 1.5em; position: relative; }
.comparison-col li.good::before { content: '✓'; position: absolute; left: 0; color: #2a8a4a; font-weight: 700; }
.comparison-col li.bad::before  { content: '✗'; position: absolute; left: 0; color: #cc4444; }

/* ==============================================
   子ページ: CTA - 電話番号
   ============================================== */
.cta-tel {
    margin-top: 1.25rem;
    font-size: 0.9rem;
    color: var(--color-text-light);
}
.cta-tel a { color: var(--color-primary); font-weight: 700; }

/* section--bg-warm ユーティリティ */
.section--bg-warm { background: var(--color-bg-warm); }