/*
 Theme Name: Cebridge School
 Theme URI: https://cebridge.jp/
 Author: CEBRIDGE
 Author URI: https://cebridge.jp/
 Description: School introduction theme for CEBRIDGE. Based on cebridge-theme with ACF/FooGallery/TablePress support.
 Version: 0.1.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: cebridge-school-theme
 Requires at least: 6.0
 Requires PHP: 8.0
*/

/* ===== 目的から探す(page-purpose) ===== */
.cb-purpose__jump { display: inline-flex; align-items: center; font-size: 13px; font-weight: 700; color: var(--cb-deep); background: #ffffff; border-radius: 999px; padding: 11px 24px; min-height: 44px; box-sizing: border-box; box-shadow: 0 4px 12px -4px rgba(26,48,87,0.15); transition: transform 0.2s; }
.cb-purpose__jump:hover { transform: translateY(-2px); color: var(--cb-deep); }
.cb-purpose__card { position: relative; display: flex; flex-direction: column; background: #ffffff; border-radius: 20px; padding: 20px 22px 18px; box-shadow: 0 6px 16px -6px rgba(26,48,87,0.12); transition: transform 0.25s, box-shadow 0.25s; color: var(--cb-ink, #333); }
.cb-purpose__card:hover { transform: translateY(-4px); box-shadow: 0 18px 34px -14px rgba(26,48,87,0.3); color: var(--cb-ink, #333); }
.cb-purpose__count { position: absolute; top: -8px; right: 14px; font-size: 11px; font-weight: 700; background: var(--cb-yellow); color: var(--cb-deep); border-radius: 999px; padding: 3px 12px; transform: rotate(3deg); box-shadow: 0 3px 8px -3px rgba(26,48,87,0.3); }
/* 目的別カードの写真。旧サイトの記事アイキャッチから 3:2 で切り出したもの。
   画像を用意していないカテゴリ(TOEFL・英検)は img ごと出ないので、文字だけのカードになる */
.cb-purpose__card-img { display: block; width: calc(100% + 44px); margin: -20px -22px 14px; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 20px 20px 0 0; }
.cb-purpose__card-img--none { display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #dbe9f8, #f0f6fd); color: #9db4d4; font-family: var(--cb-font-script, cursive); font-size: 30px; letter-spacing: 0.04em; }
.cb-purpose__card b { margin-top: 6px; font-size: 17px; color: var(--cb-deep); letter-spacing: 0.04em; }
.cb-purpose__card p { margin: 6px 0 0; font-size: 12px; line-height: 1.85; color: #556; }
.cb-purpose__arrow { margin-top: auto; padding-top: 10px; font-size: 12px; font-weight: 700; color: var(--cb-blue); align-self: flex-end; }
.cb-purpose__age { display: flex; flex-direction: column; background: #ffffff; border-radius: 24px; overflow: hidden; box-shadow: 0 6px 16px -6px rgba(26,48,87,0.12); transition: transform 0.25s, box-shadow 0.25s; color: var(--cb-ink, #333); }
.cb-purpose__age:hover { transform: translateY(-4px); box-shadow: 0 18px 34px -14px rgba(26,48,87,0.3); color: var(--cb-ink, #333); }
.cb-purpose__age-img { position: relative; height: 140px; overflow: hidden; display: block; }
.cb-purpose__age-img img { display: block; width: 100%; height: 100%; object-fit: cover; background: #e2e8f2; filter: saturate(0.9); }
.cb-purpose__age-en { position: absolute; top: 10px; left: 12px; background: var(--cb-blue); color: #ffffff; font-size: 9.5px; font-weight: 700; letter-spacing: 0.08em; border-radius: 999px; padding: 4px 13px; }
.cb-purpose__age-body { flex: 1; display: flex; flex-direction: column; padding: 18px 20px 20px; }
.cb-purpose__age-body b { font-size: 17px; color: var(--cb-deep); letter-spacing: 0.04em; display: flex; align-items: center; }
.cb-purpose__age-body p { margin: 6px 0 0; font-size: 12.5px; line-height: 1.9; color: #556; }
.cb-purpose__chip { display: inline-flex; align-items: center; gap: 8px; background: #ffffff; color: var(--cb-deep); font-size: 13px; font-weight: 700; border-radius: 999px; padding: 12px 22px; min-height: 44px; box-sizing: border-box; box-shadow: 0 10px 22px -10px rgba(10,35,80,0.5); transition: transform 0.2s; }
.cb-purpose__chip:hover { transform: translateY(-3px); color: var(--cb-deep); }
.cb-purpose__chip span { font-size: 11px; font-weight: 700; color: #8aa3cc; }